Bug 56613 - inline elements with padding in a table cell cause an unnecessary line break
Summary: inline elements with padding in a table cell cause an unnecessary line break
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2011-03-17 17:05 PDT by Philip Rogers
Modified: 2022-07-12 14:27 PDT (History)
2 users (show)

See Also:


Attachments
Test case of the bug (106 bytes, text/html)
2011-03-17 17:05 PDT, Philip Rogers
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Philip Rogers 2011-03-17 17:05:09 PDT
Created attachment 86119 [details]
Test case of the bug

Nested span elements with padding appear to cause a wrapping table cell to force an unnecessary line break.

This was found when laying out several strings wrapped in spans all inside a table cell. When padding or margin was applied to the group (so that there is space to the left of the first element), the last element would fall onto a new line even though the table cell was wide enough to fit all the elements.

Consider the following markup:
<div style="display:table-cell"><span style="padding-left:6px"><span>A <span>B</span></span></span></div>

Webkit calculates the table cell width as 33px when the span's left padding is 6px, and 27px when the span's left padding is 0px. I think both of these are correct. When the padding is 6px, there is a linebreak after the "A ", but when the padding is 0px there is no linebreak. It appears that Webkit is correctly calculating the table cell's width, but inserts an unnecessary linebreak.

Expected: There should be no linebreak and "A B" should be rendered in the div.

Actual: There is a linebreak inserted after "A ", causing "B" to get bumped to the next line.
Comment 1 Shane Stephens 2011-03-20 20:31:24 PDT
Do you know of any websites that are currently broken by this?
Comment 2 Philip Rogers 2011-03-21 06:47:28 PDT
(In reply to comment #1)
> Do you know of any websites that are currently broken by this?

The bug was encountered while developing the change history portion of adwords (there is a series of checkboxes under a chart and one of the checkboxes would fall onto a new line) but was worked around before release.
Comment 3 Brent Fulgham 2022-07-12 14:27:27 PDT
Safari, Chrome, and Firefox all agree on rendering for this test case. I don't believe there is any remaining compatibility issue.