Bug 15956

Summary:

Wikipedia page has weird layout/misrendering issue

Product:

WebKit

Reporter:

Brady Eidson <beidson>

Component:

Layout and Rendering

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

mitz, robert

Priority:

Keywords:

HasReduction, InRadar

Version:

528+ (Nightly build)

Hardware:

Mac

OS:

OS X 10.4

URL:

http://en.wikipedia.org/wiki/Clutch

Attachments:

Description	Flags
Clutches in Safari	none
Clutches in Firefox	none
Tag reduction	none
Style rule reduction	none
simple testcase	none

Brady Eidson

Reported 2007-11-12 09:43:16 PST

On the current version of http://en.wikipedia.org/wiki/Clutch, there is a section called "Clutch operation in automobiles" where, if your browser window is the correct width, there are three [edit] links right next to each other. In WebKit (Safari 2 and ToT) they layout bizarrely on top of other text in that paragraph. If you manually adjust the width of the window their position moves bizarrely on top of the text in this passage, then they get broken up into 2+1 and then 1+1+1 groups where they continue to layout on top of other text. This does not occur on Firefox. Obviously there's some funky html in this wiki page as this is atypical of the wikipedia experience, but firefox and us are doing something different, and I have no idea where to start exploring!

Attachments
Clutches in Safari (364.07 KB, image/png) 2007-11-12 09:44 PST, Brady Eidson	no flags	Details
Clutches in Firefox (370.30 KB, image/png) 2007-11-12 09:46 PST, Brady Eidson	no flags	Details
Tag reduction (647 bytes, text/html) 2007-11-13 16:24 PST, David Kilzer (:ddkilzer)	no flags	Details
Style rule reduction (654 bytes, text/html) 2007-11-13 18:35 PST, David Kilzer (:ddkilzer)	no flags	Details
simple testcase (4.64 KB, text/html) 2008-09-05 01:58 PDT, Just Me	no flags	Details
Show Obsolete (1) View All Add attachment proposed patch, testcase, etc.

Brady Eidson

Comment 1 2007-11-12 09:44:17 PST

Created attachment 17204 [details] Clutches in Safari

Brady Eidson

Comment 2 2007-11-12 09:46:43 PST

Created attachment 17205 [details] Clutches in Firefox

David Kilzer (:ddkilzer)

Comment 3 2007-11-13 16:24:16 PST

Created attachment 17245 [details] Tag reduction Partial reduction by removing uninteresting tags and text nodes. (No stylesheet reduction has been attempted other than to remove references to whole sheets. Still depends on two external resources.) Note that if "<div class="thumb tright"></div>" is removed, the "[edit]" text slides to the left of the previous <div>, which is the desired rendering. Also note that both Opera 9.22 and Firefox 2.0.0.9 render this the same way.

David Kilzer (:ddkilzer)

Comment 4 2007-11-13 16:29:59 PST

(In reply to comment #3) > Note that if "<div class="thumb tright"></div>" is removed, the "[edit]" text > slides to the left of the previous <div>, which is the desired rendering. > > Also note that both Opera 9.22 and Firefox 2.0.0.9 render this the same way. On the other hand, MSIE 7 renders the reduction as expected without removing the <div> first.

David Kilzer (:ddkilzer)

Comment 5 2007-11-13 18:35:04 PST

Created attachment 17253 [details] Style rule reduction Automated reduction of style rules originally from external stylesheets. Haven't tried removing individual properties from rules.

mitz

Comment 6 2007-11-13 18:41:59 PST

(In reply to comment #5) > Automated reduction Automated?

David Kilzer (:ddkilzer)

Comment 7 2007-11-13 19:01:49 PST

(In reply to comment #6) > (In reply to comment #5) > > Automated reduction > Automated? Automated! I wrote a new tool in the last 24 hours based on the delta tool <http://delta.tigris.org/>. It's a bit rough around the edges (I just implemented the stylesheet reduction for the reduction in Attachment #17253 [details]), but it's proven very useful so far. I've also created reduced test cases for Bug 15770, Bug 15782 and Bug 15831 today. I'll work on cleaning it up.

Alexey Proskuryakov

Comment 8 2007-11-14 03:19:55 PST