349400 - Rendering anomaly with absolute positioned DIVs with z-index, overflow/scrolling.

Status: RESOLVED DUPLICATE of bug 187435

(Firefox :: General, defect)

Description

[Tod Liebeck]

User-Agent:       Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:1.8.1b1) Gecko/20060710 Firefox/2.0b1
Build Identifier: Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:1.8.1b1) Gecko/20060710 Firefox/2.0b1

Firefox 1.5.0.6, 2.0.b1 for MacOS X (and every other earlier version I've used) has a rendering issue where scrollbars can "show through" content.  The effect is somewhat similar to that seen with IE6's SELECT controls that disregard their z-index.  With FF for OSX, what I'm seeing is just the scrollbar shining through of a DIV underneath.  It appears to occur only when you have a fairly complex stack of absolute positioned DIV with z-index attributes set (e.g., "floating DHTML windows" with a overflowing (scrolling) DIV underneath.

This issue DOES NOT affect Mozilla/Firefox for Windows or Linux.

Reproducible: Always

Steps to Reproduce:
1. Visit http://demo.nextapp.com in FF for OSX.
2. At the top of the screen there is a DHTML pulldown menu.  Click on the "Launch" menu and select "WindowPane" to start the demo module that illustrates the problem.
3. A screen will appear with three DHTML windows.  The DHTML windows are resizable.  Resize the window that says "Translucent Rendering" to be too small to contain its content, such that a scrollbar appears.
4. Drag the "Configurability" window over it such that the "Configurability" obscures the scrollbar of the "Translucent Rendering Window".

Actual Results:  
You should see the scrollbar of the "Translucent Rendering Window" shine through above the "Configurability" window.

Expected Results:  
The scrollbar should not shine through.  It does not shine through on Linux/Windows.

I apologize for sending you to a complex app in order to reproduce this.  If you require, I can create a simplest-case proof-of-concept in plain-old static HTML, but would rather not spend the hours unless it is absolutely necessary.

Please note that the app is doing nothing "tricky" with scrollbars.  All your're seeing there is an absolutely positioned DIV with overflow:auto.

Comment 1

[Phil Ringnalda (:philor)]

Even though the summary doesn't sound like your issue, note the duplicate bug 191265, which is.

*** This bug has been marked as a duplicate of 187435 ***