CSS grid-column-end Property


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

The grid-column-end property explains number of columns an item will span, or on which column-line the item will end. It supports three different types of values.

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

CSS Syntax

grid-column-end: auto|span n|column-line;

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 -