User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:220.127.116.11) Gecko/20100722 Firefox/3.6.8 Build Identifier: Mozilla/5.0 (Windows NT 5.1; rv:2.0b4pre) Gecko/20100812 Minefield/4.0b4pre See Testcase Reproducible: Always
Does this work in other browsers? If so, if you add an explicit 'width: 0' to the table, does the table end up one letter wide?
The only one I know is, that Opera changed their behavior in 10.50 that this works correctly. 'width:0' does not work. After a short try I had to set at least 'width:13px' for the table to get any effect. If I take a shorter word (max 142 chars) this also works with 'width:1px' in Opera. IE8 and Iron 4 show the same behavior as Firefox. I have not tested IE9 or Webkit nightly builds.
Word-wrap is overflow-wrap now. "For legacy reasons, UAs may also accept ‘word-wrap’ as an alternate name for the ‘overflow-wrap’ property. However this syntax non-conforming in author style sheets." http://dev.w3.org/csswg/css3-text/#overflow-wrap
Didn't we decide this aliasing was an awful idea? What happened?
http://www.w3.org/blog/CSS/2011/08/06/resolutions_174/ http://www.w3.org/blog/CSS/2012/02/19/resolutions-24/ (bottom) If anyone decided it was an awful idea, they didn't inform the CSSWG about it... afaik those resolutions are still in effect.
"word-wrap: break-word;" table-cell block * Opera (P) 12.16 working working * Safari 7.0.1 working working * Firefox 27 NOT working working When working, it behaves like a "word-break: break-all;"
This bug also applies to CSS layouts that use `display: table`. The relevant styles are: `white-space: pre-wrap; word-wrap: break-word;` Chrome 39 renders the content as expected: http://i.imgur.com/MPPSrj9.png Whereas Firefox 34 behaves like `break-all`: http://i.imgur.com/eHYvkQv.png
Just got bit by this. It’s still broken in latest Firefox. Not aware of any other browser with this issue.
I just tested in Chromium 49 and today's Firefox nightly, and both now render the testcase on this bug similarly (for both the given test, and when table-layout:fixed is used on the table). According to a similar bug report on Chromium's end, this is intentional, and they expect authors to use table-layout:fixed to get break-word working in table cells: https://bugs.chromium.org/p/chromium/issues/detail?id=155767 In light of this, I suspect this is a WONTFIX.
BTW, this test case is better supported by word-break: break-word; rather than: word-wrap: break-word; The former does not expand container. See https://crbug.com/492202, the former was not defined in CSS, but it will be.