Flexbox & Grid

Core 1D and 2D layout engines: Flexbox patterns, Grid patterns, subgrid alignment, and gap vs margin for spacing.

Flexbox and Grid cover almost every layout you will actually write. These pages collect the recurring patterns for each, subgrid alignment, and when gap beats margin for spacing.