On 2008-09-17, Warren Tang <wa*********@sina.comwrote:
Hi
How can I make a div (position relative) topmost? I tried the z-index,
but no matter how I set it, some portion of the div is always covered.
It must be then that the div is covered by its own descendents.
Any tips or suggestions? Thanks in advance.
When you set z-index on a div it does two things: moves the div itself
in its stacking context (i.e. puts it behind or in front of some other
elements), and starts a new stacking context inside the div for its own
descendents.
Because it starts that new stacking context whatever you do with z-index
on its descendents is limited to rearranging them among themselves. None
of them can be made to jump lower in the stack that the original div nor
higher than the next thing in front of it in its stacking context.
You will have the finest control if you set z-index on elements nearest
to the leaves of the document tree. That way you can keep all the
elements you're interested in rearranging in the same stacking context
as each other and all the little nested stacking contexts you create
have little or nothing in them.
So you might be better not to set z-index on the div itself, but instead
to set negative z-indices on the things that are on top of it to move
them behind it.