28-11-2008

CSS/(X)HTML Absolute positioning - z-index - and IE6

PPK (http://www.quirksmode.org/) summarized this problem on his post:
Explorer z-index bug
(http://www.quirksmode.org/bugreports/archives/2006/01/Explorer_z_index_bug.
html):

It appears that in Internet Explorer (windows) positioned elements do
generate a new stacking context, starting with a z-index value of 0, causing
the lime-green box to appear above the yellow box.
This is a serious violation of the CSS specifications, causing headages and
a lot of misunderstanding of what z-index really does.

While crediting Aleksandar Vacić for first reporting this bug, PPK doesn't
mention Aleksandar's simple solution. Give the parent a position:relative
and z-index:1..( http://www.aplus.co.yu/css/z-pos/)
position:relative;
z-index:1
 
/*		
More solutions
 
Hedger Wang (http://www.hedgerwow.com/360/bugs/css-select-free.html ) has an
ingenious solution to the conflict between z-index on elements and
subsequent select elements. He uses an iframe with z-index-1 that sits under
the targeted element. 
 
I've used this negative z-index on some of the subsequent elements and it is
helping. Fixing all of the pages will be a long journey, but at least there
is light at the end of the tunnel. 
 
 
*/

Comments:

Your comment:

»

 

[x]