Css：具有位置的元素：相对;通过位于顶部的其他元素可见

Question

我有一个无序的HTML列表：

<ul id="maintab" class="shadetabs">
<li class="selected">selected</li>
<li>not selected</li></div>

我需要对“选定”项目使用position：relative：

.shadetabs li.selected{
position: relative;
top: 1px;
............
}

到目前为止，一切都还可以。但现在我想对网站的所有其他内容展示一个div。

    <div id="vertical">
    <div id="hoz">
    content
</div></div>


    #vertical{
position:absolute;
top:50%;
margin-top:-198px;
left:0;
width:100%;
}
    #hoz{
width:320px;
margin-left:auto;
margin-right:auto;
height:90px;
border:10px solid #BF0000;
background:#f5f5f5;
text-align:center;padding:10px;
} 

不幸的是，通过div“vertical”和“horizo​​ntal”可以看到 .shadetabs li.selected 。我试着添加style =“opacity：1！important;”到“垂直”div，但它没有帮助。

Answer 1

给元素一个z-index：2。这样它就会被绘制在其他定位的内容之上。