# Grid Row

Set the size & position of items across grid rows.

**Widely available.** This feature is well established and works across many devices and browser versions.

Chrome 57 · Edge 16 · Firefox 52 · Safari 10.1

| Class | Properties | Value |
|-------|------------|-------|
| `gr-s:1` | grid-row | `span 1 / span 1` |
| `gr-s:2` | grid-row | `span 2 / span 2` |
| `gr-s:3` | grid-row | `span 3 / span 3` |
| `gr-s:4` | grid-row | `span 4 / span 4` |
| `gr-s:5` | grid-row | `span 5 / span 5` |
| `gr-s:6` | grid-row | `span 6 / span 6` |
| `gr-s:7` | grid-row | `span 7 / span 7` |
| `gr-s:8` | grid-row | `span 8 / span 8` |
| `gr-s:9` | grid-row | `span 9 / span 9` |
| `gr-s:10` | grid-row | `span 10 / span 10` |
| `gr-s:11` | grid-row | `span 11 / span 11` |
| `gr-s:12` | grid-row | `span 12 / span 12` |
| `gr-s:13` | grid-row | `span 13 / span 13` |
| `gr-s:14` | grid-row | `span 14 / span 14` |
| `gr-s:15` | grid-row | `span 15 / span 15` |
| `gr-s:16` | grid-row | `span 16 / span 16` |

## Grid Row End

| Class | Properties | Value |
|-------|------------|-------|
| `gre:1` | grid-row-end | `1` |
| `gre:2` | grid-row-end | `2` |
| `gre:3` | grid-row-end | `3` |
| `gre:4` | grid-row-end | `4` |
| `gre:5` | grid-row-end | `5` |
| `gre:6` | grid-row-end | `6` |
| `gre:7` | grid-row-end | `7` |
| `gre:8` | grid-row-end | `8` |
| `gre:9` | grid-row-end | `9` |
| `gre:10` | grid-row-end | `10` |
| `gre:11` | grid-row-end | `11` |
| `gre:12` | grid-row-end | `12` |
| `gre:13` | grid-row-end | `13` |
| `gre:14` | grid-row-end | `14` |
| `gre:15` | grid-row-end | `15` |
| `gre:16` | grid-row-end | `16` |

## Grid Row Start

| Class | Properties | Value |
|-------|------------|-------|
| `grs:1` | grid-row-start | `1` |
| `grs:2` | grid-row-start | `2` |
| `grs:3` | grid-row-start | `3` |
| `grs:4` | grid-row-start | `4` |
| `grs:5` | grid-row-start | `5` |
| `grs:6` | grid-row-start | `6` |
| `grs:7` | grid-row-start | `7` |
| `grs:8` | grid-row-start | `8` |
| `grs:9` | grid-row-start | `9` |
| `grs:10` | grid-row-start | `10` |
| `grs:11` | grid-row-start | `11` |
| `grs:12` | grid-row-start | `12` |
| `grs:13` | grid-row-start | `13` |
| `grs:14` | grid-row-start | `14` |
| `grs:15` | grid-row-start | `15` |
| `grs:16` | grid-row-start | `16` |

## Media Queries

Prefix a class with a breakpoint to apply it from that width up.

| Class | Properties | Value |
|-------|------------|-------|
| `gr-s:1` | grid-row | `span 1 / span 1` |
| `gr-s:2` | grid-row | `span 2 / span 2` |
| `gr-s:3` | grid-row | `span 3 / span 3` |
| `gr-s:4` | grid-row | `span 4 / span 4` |
| `gr-s:5` | grid-row | `span 5 / span 5` |
| `gr-s:6` | grid-row | `span 6 / span 6` |
| `gr-s:7` | grid-row | `span 7 / span 7` |
| `gr-s:8` | grid-row | `span 8 / span 8` |
| `gr-s:9` | grid-row | `span 9 / span 9` |
| `gr-s:10` | grid-row | `span 10 / span 10` |
| `gr-s:11` | grid-row | `span 11 / span 11` |
| `gr-s:12` | grid-row | `span 12 / span 12` |
| `gr-s:13` | grid-row | `span 13 / span 13` |
| `gr-s:14` | grid-row | `span 14 / span 14` |
| `gr-s:15` | grid-row | `span 15 / span 15` |
| `gr-s:16` | grid-row | `span 16 / span 16` |

## Pseudo Classes

Prefix a class with a state to apply it only while that state matches.

| Class | Properties | Value |
|-------|------------|-------|
| `gr-s:1` | grid-row | `span 1 / span 1` |
| `gr-s:2` | grid-row | `span 2 / span 2` |
| `gr-s:3` | grid-row | `span 3 / span 3` |
| `gr-s:4` | grid-row | `span 4 / span 4` |
| `gr-s:5` | grid-row | `span 5 / span 5` |
| `gr-s:6` | grid-row | `span 6 / span 6` |
| `gr-s:7` | grid-row | `span 7 / span 7` |
| `gr-s:8` | grid-row | `span 8 / span 8` |
| `gr-s:9` | grid-row | `span 9 / span 9` |
| `gr-s:10` | grid-row | `span 10 / span 10` |
| `gr-s:11` | grid-row | `span 11 / span 11` |
| `gr-s:12` | grid-row | `span 12 / span 12` |
| `gr-s:13` | grid-row | `span 13 / span 13` |
| `gr-s:14` | grid-row | `span 14 / span 14` |
| `gr-s:15` | grid-row | `span 15 / span 15` |
| `gr-s:16` | grid-row | `span 16 / span 16` |