CSS | grid-gap Property


The grid-gap property defines the size of the gap between the rows and columns in a grid layout, and is a shorthand property for the following properties:

  • grid-row-gap
  • grid-column-gap

CSS Syntax

grid-gap: grid-row-gap grid-column-gap;
Property Values:
  • grid-row-gap: It sets the size of the gap between the rows in a grid layout. Its default value is 0.
  • grid-column-gap: It sets the size of the gap between the columns in a grid layout. Its default value is 0.

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 -