RESOLVED CONFIGURATION CHANGED 211822
Line wrapping is incorrect when both ("overflow-wrap: break-word"/"word-break:break-word") and ("white-space: pre") are set
https://bugs.webkit.org/show_bug.cgi?id=211822
Summary Line wrapping is incorrect when both ("overflow-wrap: break-word"/"word-break...
Josh Brown
Reported 2020-05-12 18:19:18 PDT
Line wrapping is incorrect when both ("overflow-wrap: break-word"/"word-break:break-word") and ("white-space: pre") are set. If you set "overflow-wrap: break-word" or "word-break:break-word" and "white-space: pre", the element will wrap. This is contrary to the spec: https://drafts.csswg.org/css-text-3/#propdef-overflow-wrap > This property specifies whether the UA may break at otherwise disallowed points within a line to prevent overflow, when an otherwise-unbreakable string is too long to fit within the line box. **It only has an effect when white-space allows wrapping**... See the example below: https://jsfiddle.net/nw30cvtu/ ``` <style> .wrapper { width: 100px; border: 2px solid black; } * { word-break: break-word; } .el { white-space: pre; } </style> <div class="wrapper"> <span class="el">Lorem ipsum dolor sit amet, consectetur adipiscing elit. </span> </div> ``` Both chrome and firefox follow the spec correctly and don't wrap.
Attachments
Radar WebKit Bug Importer
Comment 1 2020-05-13 16:22:12 PDT
Ahmad Saleem
Comment 2 2022-10-01 16:52:23 PDT
I am not able to reproduce this bug in Safari 16 and STP 154 and it matches in rendering with Chrome Canary 108 and Firefox Nightly 108 and does not wrap. I think it is progression from IFC work done by Alan. Marking this as "RESOLVED CONFIGURATION CHANGED". Please reopen, if it is reproducible with updated test case. Thanks!
Note You need to log in before you can comment on or make changes to this bug.