Grid Gap

The CSS grid-gap property is a shorthand way of setting the two properties grid-row-gap and grid-column-gap. It is used to determine the size of the gap between each row and each column. The first value sets the size of the gap between rows and while the second value sets the size of the gap between columns.

// The distance between rows is 20px
// The distance between columns is 10px

#grid-container {
  display: grid;
  grid-gap: 20px 10px;
}