Bug 51978 – Marquee inside table incorrectly sized

• Status: NEW
• Component: Layout and Rendering

[Tony Gentilcore]

Created attachment 78092 [details]
Testcase

1. Visit http://www.bankmuscat.com/.
2. Notice there is a wide horizontal scroll in WebKit.
3. There is no horizontal scroll in FF4.

This is caused by a <marquee> with wide content and white-space:nowrap inside of a <table>. Removing the white-space:nowrap or the table removes the horizontal scroll. See testcase.

Originally filed in chromium as http://crbug.com/68612

[Arpita Bahuguna]

The issue seems to be not as much to do with the white-space or the table (holding the marquee) as it is to do with the overflow: hidden property set on it.

WebKit currently sets the overflow CSS property either as hidden (if specified) or as marquee (if it is a marquee element with no overflow specified) or as any of the scroll, auto, visible property values.

This causes our "marquee" setting to be overridden by "hidden" (if marquee element has been specified with the overflow: hidden property). Thus currently for the marquee element (with overflow: hidden) WebKit is not even creating the corresponding renderer.

Shall do further study of the same and try to upload a patch for it shortly.

[Arpita Bahuguna]

Created attachment 136428 [details]
Testcase for marquee with overflow property

The attached testcase contains marquee elements with different overflow properties.
Note that only the marquee elements with no overflow property specified are rendered properly.

[Arpita Bahuguna]

Created attachment 137888 [details]
Patch

[Adele Peterson]

Comment on attachment 137888 [details]
Patch

It seems a little weird to clobber the style like this.  Although I guess we're already doing that a little.  We could just make the html.css rule for marquee tags !important.

[Julien Chaffraix]

Comment on attachment 137888 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=137888&action=review

> Source/WebCore/css/CSSStyleSelector.cpp:2030
> +    if (e && e->hasTagName(marqueeTag)) {
>          style->setOverflowX(OMARQUEE);
> -    else if (style->overflowX() == OVISIBLE && style->overflowY() != OVISIBLE)
> +        style->setOverflowY(OMARQUEE);
> +    }

That's plain wrong: by default, marquee has those set-up and we allow people to override them. Do you have any proof that this is actually breaking any website? If not, that's how it's implemented in WebKit and allowing people to override that is good! (like <div style="display:table-cell">). We do need to drop our overflow: -webkit-marquee extension to fix this bug properly but that's another story.

[Julien Chaffraix]

For anyone trying to fix this, WebKit ties the marquee behavior to the overflow property (using a -webkit-marquee extension). This was done to match an older version of the specification that doesn't make sense anymore. The proper fix is to move the behavior to a -webkit-overflow-style to follow the new specification (www.w3.org/TR/css3-marquee/). We will also need to deprecate overflow: -webkit-marquee.