Bug 51978 - Marquee inside table incorrectly sized
Summary: Marquee inside table incorrectly sized
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Nobody
URL: http://www.bankmuscat.com/
Keywords:
Depends on:
Blocks:
 
Reported: 2011-01-05 20:48 PST by Tony Gentilcore
Modified: 2012-04-20 06:51 PDT (History)
5 users (show)

See Also:


Attachments
Testcase (797 bytes, text/html)
2011-01-05 20:48 PST, Tony Gentilcore
no flags Details
Testcase for marquee with overflow property (2.30 KB, text/html)
2012-04-10 04:32 PDT, Arpita Bahuguna
no flags Details
Patch (6.25 KB, patch)
2012-04-19 05:54 PDT, Arpita Bahuguna
jchaffraix: review-
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Tony Gentilcore 2011-01-05 20:48:12 PST
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
Comment 1 Arpita Bahuguna 2012-04-09 07:23:54 PDT
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.
Comment 2 Arpita Bahuguna 2012-04-10 04:32:29 PDT
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.
Comment 3 Arpita Bahuguna 2012-04-19 05:54:48 PDT
Created attachment 137888 [details]
Patch
Comment 4 Adele Peterson 2012-04-19 15:35:41 PDT
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.
Comment 5 Julien Chaffraix 2012-04-19 16:25:40 PDT
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.
Comment 6 Julien Chaffraix 2012-04-20 06:51:00 PDT
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.