4 ms·
Just found this demo in the Safari blog post: https://cdpn.io/pen/debug/xxvoqNM https://cdpn.io/pen/debug/xxvoqNM
by notpushkin 8mo ago
Just found this demo in the Safari blog post: https://cdpn.io/pen/debug/xxvoqNM https://cdpn.io/pen/debug/xxvoqNM
- crazygringo 8mo agoFascinating, thank you! Playing around with it, seems that Safari simply stops hyphenating entirely when when text-wrap is pretty, regardless of whether it's justified or not. (If you smoothly resize the browser width, it makes it pretty easy to tell if hyphens ever come up.) Which means the image on the left seems like it might be the wrong image? And now I wonder if text-wrap: pretty is supposed to avoid hyphenation? Are hyphens not pretty? Or is it just a partial implementation by Apple, that they haven't gotten around to supporting hyphenation for it yet?
- notpushkin 8mo agoYou can get it if you carefully adjust the window width! Or there’s one example in the author’s post – the word “implementation” is hyphenated for me [1]. So it looks like the algorithm tries to minimize hyphenation, which makes sense to be honest. [1]: https://matklad.github.io/2026/02/14/justifying-text-wrap-pretty.html#:~:text=a%20non%2Djoke%20implementation%20of%20text%2Dwrap https://matklad.github.io/2026/02/14/justifying-text-wrap-pr...
- crazygringo 8mo agoHa. Oh wow. OK, I got "implementation" to hyphenate... but only once I changed the zoom level, and only for one specific exact window width. One pixel narrower or wider, and it stopped hyphenating. So hyphenation exists in theory, but I'm just going to go ahead and say that however it's tuned seems completely broken.
- notpushkin 8mo agoAgain, I think it’s very deliberate :-) Hyphenated words are slightly harder to read, so it makes sense to avoid them – maybe not as zealously, though.