329548 - floating DIV using "overflow: auto" draws layer incorrectly & doesn't honor "z-index"

Status: RESOLVED WORKSFORME

(Core :: Web Painting, defect)

Description

[rick.petty]

User-Agent:       Mozilla/5.0 (X11; U; FreeBSD i386; en-US; rv:1.8) Gecko/20051207 Firefox/1.5
Build Identifier: Mozilla/5.0 (X11; U; FreeBSD i386; en-US; rv:1.8) Gecko/20051207 Firefox/1.5

When using DIV elements to create and reposition layers (e.g. popup boxes), for most situations these DIV elements will honor the "z-index" CSS setting and draw on top of other DIV elements with a lower z-index.  Under certain conditions, the same DIV elements are drawn underneath other DIV elements.  See attached HTML code and screenshot for an example.

In particular, a DIV element defined within a parent DIV element will draw correctly within its parent DIV but will appear drawn *below* any other DIV element outside of that parent DIV and whose CSS sets "overflow" to either "auto", "hidden", or "scroll".

Reproducible: Always

Steps to Reproduce:
Use the attached HTML code (with Javascript & CSS enabled) and click anywhere within the instruction box.  Or:

1). Setup at least 3 DIV elements:  parent, popup, and external ("parent" being the parent element of "popup" but not "external").
2). Ensure all layers are visible and that "popup" overlaps "external".
3). Set the "overflow: auto" CSS for external.
4). Make sure the "z-index" CSS for "popup" is greater than that of "parent" and "external".
Actual Results:  
The "popup" DIV (blue) appears below the "external" DIV (red) but above the other elements.

Expected Results:  
The "popup" DIV (blue) should appear above every other element.

The problem goes away if the popup/child DIV element is written elsewhere, outside of the parent (such as at the end of the body).  Thus, there is a workaround but it may not be easy.

Tested in FreeBSD, Gentoo, and Windows Firefox:
Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.0.1) Gecko/20060210 Firefox/1.5.0.1
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1

Also affects Seamonkey:
Mozilla/5.0 (X11; U; FreeBSD i386; en-US; rv:1.8.0.1) Gecko/20060207 SeaMonkey/1.0

Strangely, in Mozilla 1.7.12 [Mozilla/5.0 (X11; U; FreeBSD i386; en-US; rv:1.7.12) Gecko/20051206], the popup box overlays the background of the external DIV but not its text (see screenshot #2).  The problem completely disappears (for mozilla classic only) if the text zoom changes after the page is loaded!!

Comment 1

[rick.petty]

Attachment: example HTML which demonstrates the problem

Comment 2

[rick.petty]

Attachment: screenshot #1 (firefox)

Comment 3

[rick.petty]

Attachment: screenshot #2 (classic mozilla)

Comment 4

[Martijn Wargers (dead)]

Works for me with current trunk build. Probably fixed by the frame display lists patch.

Comment 5

[rick.petty]

If it's fixed in trunk, was/will that fix be merged into in 1.8 or 1.8.0-- in other words, will it be fixed by the release of 1.5.0.2?  What about for SeaMonkey?

Comment 6

[Martijn Wargers (dead)]

No, the fix for that, from bug 317375, is not going into the branch.
The patch is too risky for that.
You can download nightly trunk builds here:
http://ftp.scarlet.be/pub/mozilla.org/firefox/nightly/latest-trunk/

Comment 7

[Eli Friedman]

Changing to a more appropriate component.

Comment 8

[Eli Friedman]

And resolving WORKSFORME because it works on the trunk.

Comment 9

[Corey Benson]

This bug has been marked resolved; so is the fix targeted for a 2.0 update?

Comment 10

[Martijn Wargers (dead)]

No, see comment 6.

Comment 11

[Corey Benson]

Sorry about that.  I did not realize that comment 6 meant it would not go into a 2.0 update but rather not in a 1.5 update.  So for 2.0* days, we will have to come up with a work around for how this issue is surfaced in our world. :(  Thanks for the info.