Baseline grid

A baseline grid is a set of evenly spaced horizontal guides that text baselines sit on. It keeps lines in neighboring columns level with one another, giving magazines, books, and dense editorial pages the order of ruled paper. Josef Muller-Brockmann's Grid Systems in Graphic Design is the book that made it doctrine, and Adobe InDesign ships one as the Baseline Grid, which paragraphs snap to via Align to Baseline Grid.

Reach for it when several columns of body copy must feel like one system. Choose a base interval from the body line-height, then make paragraph spacing, heading line-heights, and block gaps land on multiples of that interval. On the web, a visible repeating gradient is useful for checking the rhythm even when exact snapping is impractical.

Gotcha: CSS positions line boxes, not the font's visible baseline, and different fonts carry different ascent and descent metrics. Images, headings, and form controls also break the count unless their total height rounds to the grid interval. Treat the grid as an alignment tool, not a reason to crush every element into one line-height.