Bug 85581 – Percentage height replaced elements sometimes cause overflow of table contents

• Component: Layout and Rendering
• Status: RESOLVED FIXED

[Terry Anderson]

Reported here: http://code.google.com/p/chromium/issues/detail?id=122806

To view an example of the bug, in chromium visit http://support.google.com/ics/nexus/bin/answer.py?hl=en&answer=1637532 and you will notice that the Settings icons are much bigger than intended.

The image has a percentage height of 60%. From inspecting the page, it appears that this is relative to the <table> rather than to its parent <p>, but the CSS specs say that the containing block of this image should in fact be the <p> element.

[Terry Anderson]

Created attachment 140163 [details]
Patch

[WebKit Review Bot]

Attachment 140163 [details] did not pass style-queue:

Failed to run "['Tools/Scripts/check-webkit-style', '--diff-files', u'Source/WebCore/ChangeLog', u'Source/WebCor..." exit_code: 1
Source/WebCore/ChangeLog:8:  You should remove the 'No new tests' and either add and list tests, or explain why no new tests were possible.  [changelog/nonewtests] [5]
Total errors found: 1 in 2 files


If any of these errors are false positives, please file a bug against check-webkit-style.

[Eric Seidel (no email)]

Comment on attachment 140163 [details]
Patch

This needs tests.  It's also certainly not chromium only.

[Terry Anderson]

Created attachment 141489 [details]
Patch

[Terry Anderson]

(In reply to comment #4)
> Created an attachment (id=141489) [details]
> Patch

I created the layout test fast/replaced/table-replaced-element.html is a scaled-down version of the page where the bug was originally found (http://support.google.com/ics/nexus/bin/answer.py?hl=en&answer=1637532).

If you view fast/replaced/table-replaced-element.html in chromium, you will see that the presence of the percent height image causes an overflow of the table contents. This patch fixes the overflow problem, but does not respect the 60% height attribute of the image.

(I have re-named this bug from "Percentage height replaced elements are sometimes displaying with incorrect size" to "Percentage height replaced elements sometimes cause overflow of table contents")

[Eric Seidel (no email)]

Comment on attachment 141489 [details]
Patch

I'm happy to reivew this.  But why do we need the wall of text?  And does this need to be a pixel test?  Can we use a dumpAsText or reference test instead?  Can we use a div/divs with fixed heights instead of the wall fo text?  inline-blocks will flow like text and you can control their size.

r- because the test could be much better.  Otherwise the chagne looks OK.

[Terry Anderson]

Created attachment 142759 [details]
Patch

[Eric Seidel (no email)]

Comment on attachment 142759 [details]
Patch

Thanks.

[WebKit Review Bot]

Comment on attachment 142759 [details]
Patch

Clearing flags on attachment: 142759

Committed r117633: <http://trac.webkit.org/changeset/117633>

[WebKit Review Bot]

All reviewed patches have been landed.  Closing bug.