z-index
doesn't apply to static
elements.
According to this page:
This property specifies the stack
level of a box whose position value is
one of absolute
, fixed
, or relative
.
If you make your div relative
instead, you can use z-index
to determine the order.
position: relative
positions the element relative to its default (static) position, so if you don't specify a top, bottom, left or right then there'll be no difference between static
and relative
other than that relative allows you to use z-index
to move your element up the stack.
Edit: based on your code sample, here's a working demo.
Edit 2: based on Nathan D. Ryan's suggestion in the comments below, you could also apply a negative z-index
to your absolutely-positioned div. This would move it behind everything else on the page that didn't have a lower z-index
defined.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…