grid-row

The grid-row property defines an item’s size and location in a grid layout and is also a shorthand property for grid-row-start and grid-row-end.

Syntax

Example:

/* .item.ex will start on row 2 and span 3 rows */

.item.ex {
  grid-row: 2 / span 3;
}

Values

grid-row-start
Specifies which row-line the item will start on.

grid-row-end
Specifies on which row-line the item will end, or the number of rows an item will span.

Browser Compatibilty

Demos

Have a code example of grid-row? Submit a codepen.io demo and we'll showcase it here ↴