As a developer, you don’t know the final size, font size, or even language of a headline or paragraph. All the variables needed for an effective and aesthetic treatment of text wrapping, are in the browser. Since the browser does know all the factors, like font size, language, and allocated area, it makes it a great candidate for handling advanced and high quality text layout.
This is where two new text wrapping techniques come in, one called
Una Kravets & Bramus & Adam Argylebalanceand the otherpretty. Thebalancevalue seeks to create a harmonious block of text whileprettyseeks to prevent orphans and ensure healthy hyphenation. Both of these tasks have traditionally been done by hand, and it’s amazing to give the job to the browser and have it work for any translated language.
Nice to see the web platform introducing CSS features such as text-wrap that are easy to pick up and use – as opposed to things like grid layouts and nesting – while also being extremely useful and offloading to the browser tasks that would otherwise need complex work from web developers. The balance keyword is widely supported in browsers already, while pretty is exclusive to Chromium-based browsers for now. Even so, the lack of browser support for pretty won’t affect visitors in Safari and Firefox in any meaningful way, since the text will simply wrap in the default way.