I believe Mozilla and Opera are correct and IE is not (according to the
spec). An explanation:
The CSS spec says that if an element does not have a z-index specified
then it defaults to "auto". Elements with z-index:auto do not start
their own stacking context. Therefore, your blue div has its own
stacking context (and is drawn on top), but all the other divs share the
same stacking context, namely the root element.
From there, the usual rule applies that an element is drawn on top of
elements that come before it. So the green div is drawn on top of the
red div since it comes after it.
Basically, elements only share stacking context with their nearest
ancestor that has an explicit z-index specified. If you want all the
elements in the yellow div to share stacking context, then the yellow
div needs to have a z-index specified.
Hope this helps. It is actually very logical. Think of it like
positioning and containing block rules: an element's positioning context
is dependent on its nearest *positioned* ancestor (definition of
containing block), not necessarily its parent element.
Good luck
--J
ahmed wrote:
> Try it also on ie5.5 maybe even 5 and 4 i realy think they do it right
> Its funny though Opera5.11 does it like mozilla
>
> i man why do they do it like that,, it dosn't sound logical to me! i can
> barely even think abiout it it just makes my head feel sick,, cause i mean
> its totaly illogical!
>
>
>