Sent by Michael Landis on 21 April 2005 21:09
GKR wrote (about http://www.butchross.com/kyfolkweb/):
> in IE for PC I cannot get the "events" drop down to sit above the
> right hand side bar (if you go there, you'll see what I mean)
> anyway, I've mucked about with positioning and the z-index but to no
> avail. Any ideas?
Hi, GKR,
Changing the z-index should work, but it really depends on where it's
changed.
On the site right now, it looks like you have the following styles dealing
with the navigation (I've removed anything not having to do with
positioning):
/* drop down menu --suckerfish */
ul {
z-index: 2;
}
li {
float: left;
position: relative;
}
li ul {
position: absolute;
}
The problem has to do with where you've got the z-index property. The UL in
question is not positioned, so z-index has no effect, since it only applies
to elements that are absolutely or relatively positioned[1]. The LI within
that UL is positioned relatively, but no z-index is provided. This means
that everything within the LI is on the same level as the rest of the
page[2].
When elements are at the same level, elements closer to the beginning of
the source code are painted before elements that are defined closer to the
end. So five paragraphs sitting on a normal page are painted one after the
other, for example -- paragraph 1, paragraph 2, and so on, through
paragraph 5. Floats, however, sit atop other boxes that aren't positioned
(assuming the positioned boxes don't have negative z-indices, that is).[3]
It looks like IE is making the mistake of painting floats on top the
positioned elements, instead of underneath. To ensure that the positioned
navigation is atop the float, position the parent UL relatively. With the
z-index of 2, that should be all you need.
HTH,
Michael
[1] http://www.w3.org/TR/CSS21/visuren.html#z-index
[2] http://www.w3.org/TR/CSS21/visuren.html#x35
[3] http://www.w3.org/TR/CSS21/visuren.html#x36
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
