CSS IE7 不尊重 z-index
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1466695/
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
IE7 does not respect z-index
提问by user48408
Running in compatibility mode the calendar below renders behind the textboxes below. IE8 displays the calendar how I need it to.
在兼容模式下运行,下面的日历呈现在下面的文本框后面。IE8 以我需要的方式显示日历。
My CSS
我的 CSS
.MyCalendar .ajax__calendar_container
{
border:1px solid #7F9DB9;
background-color: #ffffff;
z-index : 1004 ;
width:190px;
}
the textboxes which are overlaying the calendar don't have their z-index set anywhere although I have tried in my server side code to set their z-index to -1 if I detect IE7 to no avail. Any suggestions?
覆盖日历的文本框没有在任何地方设置 z-index,尽管我已经尝试在我的服务器端代码中将它们的 z-index 设置为 -1,如果我检测到 IE7 无济于事。有什么建议?
回答by rhodesjason
IE has problems with z-index. Most browsers treat the page as one continuous stacking context, but in IE, positioned elements generate a new stacking context, starting with a z-index value of 0.
IE 的 z-index 有问题。大多数浏览器将页面视为一个连续的堆叠上下文,但在 IE 中,定位元素生成一个新的堆叠上下文,从 z-index 值 0 开始。
As mentioned in this article:
如本文所述:
http://trwa.ca/2012/03/ie-z-index-bug-and-how-to-squash-it/
http://trwa.ca/2012/03/ie-z-index-bug-and-how-to-squash-it/
try giving the calendar's parent element an even higher z-index.
尝试给日历的父元素一个更高的 z-index。
回答by leymannx
I finally got it on top with an additional transparent background image. IE8. SASS:
我终于用一个额外的透明背景图像把它放在了上面。IE8。萨斯:
#galerie-link {
position: absolute;
z-index: 1000;
top: 25px;
left: 40px;
a {
display: block;
width: 185px;
height: 90px;
background-image: url(../images/transparent.png);
}
}