Row Class

This class creates a CSS grid for you to place content in. Each child of your component will be placed in a separate, equally sized, row. You can use the grid-row CSS property to change the placement and number of rows each child uses.

HINT
The row layout is a default layout with this .row class added to the ::content:: slot wrapper.

Variables

/

CSS

/* Base Styling */
 .row {
    display: grid;
    grid-auto-flow: row;
    grid-auto-rows: 1fr;
}

/* Overridable Styling */
:where(.row) {
    place-items: center;
}