Last Comment Bug 587438 - word-wrap:break-word does not work in tables
: word-wrap:break-word does not work in tables
Status: NEW
: css3, dev-doc-needed, testcase
Product: Core
Classification: Components
Component: Layout: Tables (show other bugs)
: Trunk
: All All
-- normal with 10 votes (vote)
: ---
Assigned To: Nobody; OK to take it and work on it
Depends on:
Blocks: css-text-3 955857
  Show dependency treegraph
Reported: 2010-08-15 03:49 PDT by karl155
Modified: 2016-05-18 04:56 PDT (History)
19 users (show)
See Also:
Crash Signature:
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---

Testcase (1.61 KB, text/html)
2010-08-15 03:50 PDT, karl155
no flags Details

Description User image karl155 2010-08-15 03:49:24 PDT
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv: 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
Comment 1 User image karl155 2010-08-15 03:50:15 PDT
Created attachment 466097 [details]
Comment 2 User image David Baron :dbaron: ⌚️UTC-8 2010-08-15 20:08:09 PDT
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?
Comment 3 User image karl155 2010-08-16 03:15:34 PDT
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.
Comment 4 User image [Baboo] 2012-03-29 03:53:34 PDT
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."
Comment 5 User image :Ms2ger (⌚ UTC+1/+2) 2012-03-29 03:57:38 PDT
Didn't we decide this aliasing was an awful idea? What happened?
Comment 6 User image fantasai 2012-03-29 10:41:54 PDT (bottom)
If anyone decided it was an awful idea, they didn't inform the CSSWG about it... afaik those resolutions are still in effect.
Comment 7 User image Karl Dubost :karlcow 2014-02-06 13:17:22 PST
"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;"
Comment 8 User image Karoun Kasraie 2014-12-08 15:03:47 PST
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:

Whereas Firefox 34 behaves like `break-all`:
Comment 9 User image jondallas 2015-10-05 17:17:39 PDT
Just got bit by this. It’s still broken in latest Firefox. Not aware of any other browser with this issue.
Comment 10 User image Thomas Wisniewski 2016-05-14 13:04:10 PDT
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:

In light of this, I suspect this is a WONTFIX.
Comment 11 User image Koji Ishii 2016-05-18 04:56:54 PDT
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, the former was not defined in CSS, but it will be.

Note You need to log in before you can comment on or make changes to this bug.