Blog

Line Breaking and Overflow: white-space, overflow-wrap, word-break, hyphens, text-wrap: balance/pretty and Multi-Line Truncation

Use overflow-wrap: anywhere for long URLs and ISBNs, white-space: pre-line for user text, text-wrap: balance for headings, and the -webkit-line-clamp recipe for multi-line truncation; do not rely on hyphens: auto for Turkish text. On Bookstore's book detail page we measure the min-content difference between break-word and anywhere, Turkish hyphenation failing in both engines, balance and pretty results, and WebKit not painting ::first-letter in a clamped box.