CSS Grid

CSS Grid is a two-dimensional layout mode, enabled by display: grid, that arranges content in rows and columns. You define tracks with grid-template-columns and grid-template-rows, the fr unit distributes free space, and gap spaces the cells. It suits full page layouts.

Example

display: grid;
grid-template-columns: 1fr 2fr;
gap: 1rem;

Related concepts

The whole glossary