typography
CSS text-wrap: balance for Headings
Eliminate orphaned words in headings with text-wrap: balance and improve paragraph line endings with text-wrap: pretty.
text-wrap: balance is a 2024 CSS property that makes headings wrap with approximately equal line lengths — preventing the typographically awkward single-word last line (orphan). text-wrap: pretty applies a similar optimisation to paragraph text without the performance overhead of full balancing. Both are now supported in all major browsers.
Usage Note
text-wrap: balance works best on headings of 2–4 lines. It intentionally ignores text longer than ~10 lines for performance reasons. text-wrap: pretty is safer for body text at any length. Both are progressive enhancements — no fallback needed.
Tags
#text-wrap#balance#pretty#typography#orphan#heading