css - IE7 不尊重 z-index

Question

在兼容模式下运行，下面的日历呈现在下面的文本框后面。IE8 以我需要的方式显示日历。

我的 CSS

.MyCalendar .ajax__calendar_container 
{
border:1px solid #7F9DB9; 
background-color: #ffffff; 
z-index : 1004 ;   
width:190px;
}

覆盖日历的文本框在任何地方都没有设置 z-index，尽管如果我检测到 IE7 无济于事，我已经尝试在服务器端代码中将它们的 z-index 设置为 -1。有什么建议么？

Answer 1

IE 的 z-index 存在问题。大多数浏览器将页面视为一个连续的堆叠上下文，但在 IE 中，定位的元素会生成一个新的堆叠上下文，从 z-index 值 0 开始。

如本文所述：

http://trwa.ca/2012/03/ie-z-index-bug-and-how-to-squash-it/

尝试给日历的父元素一个更高的 z-index。

Answer 2

我终于用一个额外的透明背景图像把它放在了上面。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);
    }
  }