Когда у нас есть некоторые absolute
DIV на странице и один fixed
DIV в качестве ребенка одного из тех absolute
DIV, у которого больший z-index
чем эти absolute
DIV, fixed
DIV отстает от absolute
DIV!
Вот так: http://jsfiddle.net/3qRaR/1/
HTML:
<div class='l1'>
<div class='data'></div>
</div>
<div class='l1'>
<div class='data'></div>
</div>
<div class='l1'>
<div class='data'></div>
</div>
<div class='l1'>
<div class='data'></div>
</div>
CSS:
.l1{
display: block;
width: 100px;
height: 100px;
background-color: yellow;
z-index:1001;
margin: 5px;
position: absolute;
}
.l1:nth-child(1){
left: 5px;
top: 5px;
}
.l1:nth-child(2){
left: 110px;
top: 5px;
}
.l1:nth-child(3){
left: 220px;
top: 5px;
}
.l1:nth-child(4){
left: 330px;
top: 5px;
}
.data{
display:none;
position: fixed;
left:0px;
top:0px;
right:0px;
bottom:0px;
z-index:2000;
background: black;
}
.l1:first-child .data{
display: block;
}
Зачем?
Как я могу заставить его идти к ним?
благодаря
Удалите z-index из правила .li
а черный.data div будет сидеть на столе желтых.li div. Я предполагаю, что это то, что вы пытаетесь сделать?
.l1{
display: block;
width: 100px;
height: 100px;
background-color: yellow;
// Removed the z-index from here
margin: 5px;
position: absolute;
}
fixed
делает divs fixed
для документа, а не элементом, даже если оно является absolute
. Сделайте.data divs позиции absolute
, а не fixed
.
.data{
display:none;
position: absolute;
left:0px;
top:0px;
right:0px;
bottom:0px;
z-index:2000;
background: black;
}
Изменить: если вы хотите, чтобы fixed
div закрывал весь документ, просто установите fixed
div-контейнер более высоким z-index
чем остальные:
.l1:nth-child(1){
z-index: 10000;
left: 5px;
top: 5px;
}
fixed
(относительно окна) внутри элемента, который являетсяabsolute
(относительно документа)? Если вы хотите, чтобы это было впереди, переместите его за пределы родительского контейнера.