[英]How to bring DIV2 to top WRT DIV1?
I am trying to bring DIV2 on top of DIV1,I have followed few of the earlier questions but nothing seems to have solved my problem . 我正在尝试将DIV2置于DIV1之上,我没有关注先前的几个问题,但似乎没有任何事情可以解决我的问题。
Here are the corresponding DIV elemnts folowed by their CSS. 以下是其CSS对应的DIV元素。
This is what am refering to DIV1 这就是指DIV1
<div class="left_black_out"><img alt=" close" src="./img/slider_in.png" style="background:none rgba(255,255,255,0.8); opacity:.3">
<div class="world" >
<h2>WORLD ABOVE THE WORLD</h2>
<p>THIS IS IN TOP</p>
</div>
</div>
This is DIV2 这是DIV2
<div class="disclaimer4" id="basic-modal-content">
<h3>Disclaimer</h3>
<p>Want this on TOP</p>
</div>
Corresponding CSS 对应的CSS
.left_black_out {
background:none rgba(0, 0, 0, 0.8);
zoom:1;
bottom: 0;
display: block;
height:100%;
left: -660px;
top:30px;
padding: 100px 60px 30px;
position: absolute;
width: 800px;
z-index: 9990;
/*overflow:hidden;*/
float: left;
margin-top:-30px;
}
.disclaimer4 {
position: absolute;
opacity: .99
z-index: 9999;
overflow:hidden;
float: left;
}
If I change the position to "relative" the DIV1 vanishes completely. 如果我将位置更改为“相对”,则DIV1完全消失。 I have tried different values for z-index of DIV2 including negative values. 我尝试了DIV2的z索引的其他值,包括负值。 Still am not able to bring it to top . 仍然无法使其达到最高水平。 How this can be achieved. 如何做到这一点。
Your answer: fiddle link 您的答案:小提琴链接
.left_black_out {
background:none rgba(0, 0, 0, 0.8);
zoom:1;
bottom: 0;
display: block;
height:100%;
left: -660px;
top:30px;
padding: 100px 60px 30px;
position: absolute;
width: 800px;
z-index: -9990;
float: left;
margin-top:-30px;
} }
change the z-index of .left_black_out in minus(-9990;) 更改.left_black_out的z索引为负(-9990;)
try this one 试试这个
.left_black_out {
background:none rgba(0, 0, 0, 0.8);
zoom:1;
bottom: 0;
display: block;
height:100%;
left: -660px;
top:30px;
padding: 100px 60px 30px;
position: absolute;
width: 800px;
float: left;
margin-top:-30px;
z-index:0;
}
.disclaimer4 {
position: absolute;
overflow:hidden;
float: left;
background:#fff;
z-index:1;
opacity:0.9;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.