z-index - fixed, absolute, relative
the z-index in "div.dialog" doesnt seem to influ the layer index? the "div.dialog" div has to be on top of everything
EDIT:
div.dialog_bg
has to be in the background#topfix
has to be on top of thatdiv.dialog
has to be on top of everything
code...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<body style="margin:0px">
<style>
#topfix {
position:fixed;
top:0px;
left:0px;
width:100%;
height:130px;
z-index:1;
background:#ff0000;
}
#div_dialog {
position:relative;
z-index:1;
}
div.dialog {
position:absolute;
background:#ffffff;
border:1px solid #000000;
width:400px;
height:300px;
top:50px;
left:100px;
z-index:99; // doesnt seem to influ the layer index
}
div.dialog_bg {
position:absolute;
background:#ffff00;
width:100%;
height:500px;
opacity:0.3;
}
</style>
<div id="div_dialog">
<div class="dialog_bg"></div>
<div class="dialog">test&l开发者_如何学Got;br>test<br>test<br>test<br>test<br>test<br>test<br>test</div>
</div>
<div id="topfix">
topfix
</div>
</body>
</html>
Then you need to give its parent #div_dialog
at least z-index: 2
because the z-index is relative to its parent and dialog
is the only child of #div_dialog
.
Also z-index: 1
for #div_dialog
isn't enough because #topfix
comes after it in HTML and will be placed over #div_dialog
.
EDIT
So regarding your "new" you have to give
#div_dialog {
position: absolute;
z-index: 9999;
}
.dialog_bg {
z-index: 1;
}
.dialog {
z-index: 2;
}
精彩评论