Issue metadata
Sign in to add a comment
|
Applying both "word-break: break-all" and "word-wrap: break-word" to continuous punctuation marks such as "................" in Chrome 67
Reported by
potassiu...@gmail.com,
Jun 13 2018
|
||||||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Safari/537.36 Example URL: http://sinst.html.xdomain.jp/zengaku/jkkn/chrome_bug5.html Steps to reproduce the problem: 1. Place a div element with a width in pixels <div style="width:100px"></div> 2. Write many many continuous punctuation marks so that its width overflows the div. <div style="width:100px">This is a short text. .......................</div> 3. Attempt to apply both "word-break: break-all" and "word-wrap: break-word" to the element. What is the expected behavior? I can apply both "word-break: break-all" and "word-wrap: break-word" to "................". What went wrong? I can't apply both "word-break: break-all" and "word-wrap: break-word" to "................". Only "word-break: break-all" is prioritized over "word-wrap: break-word", and "word-break: break-all" has an awkward non-breaking processing. About attached screenshots: I want a result of 7.png, but there's no way to get this result in Chrome 67. If I get a result of 7_2.png by "word-break: break-all", I also get a result of 7_3.png. If I get a result of 7_4.png by "word-wrap: break-word", I also get a result of 7_5.png. It's a dilemma. Perhaps the non-breaking "......................." issue seems to be caused by some exceptional processing being applied to punctuation marks when "word-break: break-all". And what is worse, the priority of the processing seems to be higher than word-wrap: break-word. So "word-wrap: break-word" to "......................." doesn't work in a element with "word-break: break-all". This causes the dilemma. Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? N/A Chrome version: 67.0.3396.87 Channel: stable OS Version: 10.0 Flash Version: The source code of the attached screenshots is like this: <div style="word-break: xxxxx; word-wrap: xxxxx;"> <div>This is a short sample text.</div> <div>This is a looooooooooooong sample text.</div> <div>This is a ................ sample text.</div> </div> For more details, please follow the URL above.
,
Jun 13 2018
,
Jun 15 2018
I request of Chrome that the exceptional processing to the punctuation marks should be removed in case of break-all. Conversely, this processing should be done when word-break: keep-all. Note: There is also a similar bug in Edge (Edge also has a bug like the 3rd issue: http://sinst.html.xdomain.jp/zengaku/jkkn/chrome_bug5.html#s3). But Edge doesn't have the 4th issue (http://sinst.html.xdomain.jp/zengaku/jkkn/chrome_bug5.html#s4). I think that the behavior of Firefox 60 is ideal.
,
Jun 28 2018
,
Jun 28 2018
The `break-all` behavior is designed for i18n usage and it's already used widely. W3C added a new property for your purpose, `line-break: anywhere`, and it's looking for for someone to implement in issue 720205.
,
Jun 28 2018
Thank you for the information...! I didn't know such an attribute, `line-break: anywhere`. I'll wait for the implementation. Thanks. |
|||||||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||||||
Comment 1 by krajshree@chromium.org
, Jun 13 2018