javascript 设置 Z 索引不起作用。容器后面的按钮（HTML - CSS）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24086707/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
set Z index not working. button behind a container (HTML - CSS)
提问by user3697289
I using Metro css (windows 8 style) and have a problem.
I have container with alerts (the blue in the picture) ,
and above , there is 'IT -CENTER ' , If I click there it open a button.
the problem that the button behind the container..
I try to set the Z index of the container to -1 , and it's not help.
我使用 Metro css（windows 8 样式）并且遇到了问题。我有带有警报的容器（图片中的蓝色），上面有“IT -CENTER”，如果我点击它会打开一个按钮。容器后面的按钮的问题..我尝试将容器的 Z 索引设置为 -1 ，但没有帮助。
the dropdownlist with the button(IT-CENTER): IT-CENTER
带有按钮的下拉列表（IT-CENTER）：IT-CENTER
<li style="z-index:3"><a href="Login.aspx">?????</a></li>
</ul>
</div>
and the container(blue one):
和容器（蓝色的）：
<div id="alerts-container" style="z-index:-1">
<div id="toast-example1" class="toast toasttext02 fade in">
<button type="button" class="close" data-dismiss="alert"></button>
<div class="pull-left">
<div class="toast-object icon-info-4"></div>
</div>
<div class="toast-body" style="text-align:right">
(it's without the closing tags..)
（它没有结束标签..）
what should I do?
我该怎么办？
thanks!!
谢谢！！
回答by AlexTroy
You must set
position:relativeif you are settingz-index- it is very important thing and can lead to your bugIf the 1 method doesn't help you should try to set
z-indexes to the possible parents of that button (can say for sure I don't see your code)
position:relative如果您正在设置z-index，则必须进行设置- 这是非常重要的事情，可能会导致您的错误如果 1 方法没有帮助，您应该尝试将
z-indexes设置为该按钮的可能父项（可以肯定地说我没有看到您的代码）
回答by Azad
overflow: hidden;
to parent DIV worked for me
父母 DIV 对我来说有效
