CSS Grid Gap

CSS Grid Gap — a practical guide to CSS grid-gap with clear examples you can reuse in real projects.

CSS Tutorial Series (69/109). Prefer one article? Read the complete CSS tutorial.

Short description

Same gap model as Flexbox — consistent mental model.

Grid gap

.cards {
  display: grid;
  gap: 1rem 1.25rem;
}