绝对定位的div在正常流后面

Question

我想将一个 div 设为背景，并使用绝对定位来实现。一切工作正常，但问题是它会出现在正常流程中任何东西的上方，调整 z-index 根本没有用。

<div id="blind">
    <div id="blindbackground"></div>
    <div id="blindcontainer">
        <div class="loader">
            <img class='loader' src="/img/loader.gif"/>
        </div>
    </div>
    <div id="blindclosecontainer">
       <img id='blindclose' src="/img/close.gif"/>
    </div>
</div>

这是 CSS 代码：

#blind{
    position :absolute;
    width:100%;
    z-index: 2;
    border-bottom: 1px silver solid;
}
#blindclosecontainer{
    text-align: right;
}

#blindbackground{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    background-color: white;
    filter:alpha(opacity=60);
    opacity:0.6;
}
#blindcontainer{
    margin:auto;
    width:500px;
    background-color: white;
    padding:10px;
}

.loader{
    margin: auto;
    width:18px;
    margin-top:10px;
    margin-bottom: 5px;
}

- vasion

---

你能给我们提供一个实时的例子吗？ - Sune Rasmussen

Answer 1

将#blindcontainer和#blindclosecontainer类添加position:relative;。

- Guffa