Grid-Gap

Adding space between grid columns and rows is a single command: grid-gap. A single measurement can give you consistent gaps in both directions.

grid-gap: 2rem;

grid-gap can take two different measurements: row-gap and column-gap (respectively… you’ll see this order a lot. Try to remember that it’s “run before rise”). This is the better option for when you’re trying to match row gaps to vertical rhythm.

See the Pen Grid Gap by Dave Cross (@davecross) on CodePen.