CSS grid-row-end Property

The grid-row-end CSS property specifies a grid item's end position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-end edge of its grid area.

The grid-row-end property in CSS is used to define the grid items end position within a grid row by specifying the inline edge of its grid area.

The grid-row-end property defines how many rows an item will span, or on which row-line the item will end (see example at the end of this page).

CSS Syntax

grid-row-end: auto|row-line|span n;
Property Values:
  • auto: The grid items span for the default value of one row.
  • span int: It specifies the number of rows the item will span.
  • integer: It specifies the row on which the item ends.
  • initial: It sets the grid-row-end property to its default value.
  • inherit: The grid-roe-end property is inherited from its parent.

Supported Browsers:

  • Firefox: 52.0, 2.0 -moz-
  • Google Chrome: 50.0, 4.0 -webkit-
  • Internet Explorer: 10.0
  • Safari: 9.0, 3.1 -webkit-
  • Opera: 37.0, 15.0 -webkit-, 11.1

Example -