Closed Bug 1478455 Opened 5 years ago Closed 5 years ago

overflow-wrap: normal for table into html.css


(Core :: Layout: Tables, defect)

Not set



Tracking Status
firefox-esr52 --- unaffected
firefox-esr60 --- unaffected
firefox61 --- unaffected
firefox62 --- unaffected
firefox63 --- verified


(Reporter: rowbot, Assigned: xidorn)



(Keywords: regression)


(1 file)

I am running on the latest nightly on Windows 10.

1) Visit
2) Scroll down to bring the table into view.

The table shouldn't overflow its containing element and the first and last 2 columns should not be squished in such a way that the text becomes vertical. This renders properly on Edge and Chrome. Disabling Webrender and running in safe-mode did not fix the issue.
This was regressed by Bug 1472386. 

I should mention that when it was working the table rendering was *extremely* slow. I'll file a separate bug for that.
Blocks: 1472386
Keywords: regression
I filed Bug 1478500 about the performance issue.
Hmm... so this is because GitHub set "word-wrap: break-word" on the top level, and in bug 1472386 we changed how intrinsic size is calculated in that case, which breaks tables on GitHub...

If I add "word-break: break-word" on the page, the table would become broken in the same way on Chrome, which indicates that it isn't really the problem of table layout, but more related to intrinsic size calculation for that case.
When in .markdown-body rule overflow-wrap is set to normal its looking normal. Funny thing

>If I add "word-break: break-word" on the page, the table would become broken in the same way on Chrome
Not exactly the same. In Chromium is still keeping width sie from <div class="markdown-body"> but in Firefox take size from <div class="repository-content">
Maybe consider adding `table { word-wrap: normal; }` to the UA style sheet, see if that addresses most of the web-compat concerns?
Or just not inherit that rule for tables by default from higher levels
Assignee: nobody → xidorn+moz
This would fix this bug as well as webcompat/web-bugs#17900.

The argument for this to be a reasonable change is that, table cells can
never shrink below the min intrinsic size, so overflow-wrap: break-word
doesn't make any sense in table when it didn't affect intrinsic size.
So this change basically revert the behavior of bug 1472386 for tables
which seems to be the biggest problem so far.
Comment on attachment 8996900 [details]
Bug 1478455 - Add overflow-wrap: normal for table to html.css. r?dbaron

David Baron :dbaron: 🏴󠁵󠁳󠁣󠁡󠁿 ⌚UTC-7 has approved the revision.
Attachment #8996900 - Flags: review+
As I noted in the review and would like to note here as well since it's not specifically about the code:

One note is that you should somehow keep track of the stuff that would need to be backed out if we decide to revert the whole set of changes, since now you have two pieces (this and bug 1472386).  I think you should file a tracking bug for a decision to either ship or revert the whole set of changes, request tracking for 63 (that's the right release, right?), so that we have a bug where we're being pushed to make an explicit decision one way or the other about shipping in 63 rather than just shipping by default because we put it in nightly.
Pushed by
Add overflow-wrap: normal for table to html.css. r=dbaron
Blocks: 1480284
Filed bug 1480284 for tracking.
Closed: 5 years ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla63
Summary: Markdown table rendered incorrectly → overflow-wrap: normal for table into html.css
I have reproduced this bug with Nightly 63.0a1 (2018-07-25) on Windows 7, 64 Bit!
This bug's fix is verified with latest DeveEdition Beta 63.0b14!

Build ID 	20181011200118
User Agent 	Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:63.0) Gecko/20100101 Firefox/63.0
QA Whiteboard: [good first verify] → [good first verify] [testday-20181012]
Thank you, Mohammad Maruf Rahman!
You need to log in before you can comment on or make changes to this bug.