25 ms·
This solves a real problem for me. In the past I've used <wbr> with white-space:nowrap set on the parent to help choose logical breaks in text, but it's tediou
by SquareWheel 4y ago
This solves a real problem for me. In the past I've used <wbr> with white-space:nowrap set on the parent to help choose logical breaks in text, but it's tedious and requires DOM access.
A simple CSS rule to automatically calculate this is very welcome.
I'm not sure I like the name "pretty" for the second rule though. If they have to expose the algorithm (first-fit vs Knuth-Plass), I'd rather they choose more descriptive names.
- 9dev 4y agoYou can also use between the penultimate and the ultimate word, that doesn’t require additional styling.
- iamben 4y agoThis is my preferred method (now!). Also very simple to write a couple of lines of JavaScript to target P and H elements and replaces the last space with a non breaking space. But a CSS method is very welcome!
- toastal 4y agoPlease do this at build time instead of shipping to clients. You'll slow down page rendering, introduce a repaint, and now require a script. Considering all browsers will be doing the exact same execution, it's needlessly wasteful. Same thing applies to client-side syntax highlighting and LaTeX.
- GavinMcG 4y agoBut that alters the content, and copy/paste would carry that forced pairing into a different line-length context.
- brycewray 4y agoIn macOS, you can achieve this in plain text with [option]-[space]. Helpful in Markdown — although, of course, you can use ` ` in Markdown, as well.