Bug 15956 – Wikipedia page has weird layout/misrendering issue

• Status: RESOLVED
• Resolution: FIXED
• Component: Layout and Rendering

[Brady Eidson]

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!

[Brady Eidson]

Created attachment 17204 [details]
Clutches in Safari

[Brady Eidson]

Created attachment 17205 [details]
Clutches in Firefox

[David Kilzer (:ddkilzer)]

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)]

(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)]

Created attachment 17253 [details]
Style rule reduction

Automated reduction of style rules originally from external stylesheets.

Haven't tried removing individual properties from rules.

(In reply to comment #5)
> Automated reduction

Automated?

[David Kilzer (:ddkilzer)]

(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]

See also: bug 13698.

[Just Me]

Created attachment 23188 [details]
simple testcase

I originally put this in https://bugs.webkit.org/show_bug.cgi?id=18250#c3 but it turns out the bug was unrelated. See the link for comments by Dave Hyatt.

<rdar://problem/6643170>

[Robert Hogan]

The reductions render correctly now. Closing.