Use text-wrap: pretty for Body Paragraphs
Apply text-wrap: pretty to <p> elements to eliminate single-word last lines and improve hyphenation in long-form content.
Detailed Explanation
What pretty Actually Does
text-wrap: pretty only touches the last few lines of a paragraph. It does not balance the whole block — that would be too expensive for body text. Instead, the browser optimizes the trailing 4 lines (Chrome's default) to:
- Avoid orphans (a single word on the last line)
- Avoid widows (a single short last line)
- Choose better hyphenation points if
hyphens: autois also set - Keep punctuation off the start of a line
The CSS
article p {
text-wrap: pretty;
hyphens: auto;
line-height: 1.6;
}
Why not balance?
Two reasons. First, balance is O(n²) and disables itself past 6 lines — the wrong tool for paragraphs that routinely exceed 10 lines. Second, fully balancing a paragraph would make every line the same width, which actually hurts readability for body text. Newspapers and books deliberately use ragged-right alignment because it gives the eye stable left-edge anchors as it returns from the end of each line.
Hyphenation interaction
pretty and hyphens: auto are designed to work together. With both enabled, the browser's line-breaking algorithm has more candidate break points to choose from, so the last few lines can be tuned more aggressively. Without hyphens, pretty still works but has fewer options.
Browser support
Chrome 117+, Edge 117+, Safari 17.5+. Firefox does not yet support pretty (as of early 2026) and falls back to default wrapping. Treat pretty as progressive enhancement — your paragraphs must remain readable when it's ignored.
Use Case
Article bodies, blog posts, marketing landing-page copy, documentation content, modal descriptions, email-newsletter content rendered in-app. Anywhere a paragraph exceeds 3-4 lines and orphan words would distract.