ie7 中的 z-index 问题，具有固定的标题元素和透明度答案

【问题标题】：z-index issue in ie7 with fixed header element and transparencyie7 中的 z-index 问题，具有固定的标题元素和透明度
【发布时间】：2011-02-08 02:48:54
【问题描述】：

我使用 960.gs 模拟了一个页面，该页面在一个 div 中固定了几个元素，页面的内容将在该 div 下流动。这个 div 的背景是一个 CSS 渐变，高度为 100%（如果渐变应用于页面的实际主体，它实际上并没有扩展页面的整个宽度）。当用户向上滚动时，内容将在不透明菜单后面可见。

布局在 FF 和 Chrome 中按我想要的方式工作，但页面内容在 IE7 中的固定上部区域滚动。

我知道正在创建一个新的堆叠上下文，但我无法通过摆弄相关元素或其父元素的 z-index 来解决此问题。我知道我可以合并网格使用的一些额外 div，但我无法以保持渐变和透明度效果的方式这样做。

如何在 IE7 中实现这种外观？

【问题讨论】：

【解决方案1】：

您需要为该滚动 div 提供一个小于主标题上的 z-index 的 z-index。要控制 msie 7 的透明度，只需将以下 css 代码添加到文档末尾的

【解决方案2】：

在 IE7 中，元素被其定位的父元素捕获，无法逃脱。不能将定位父节点的子节点交织在一起，因为 ie7 和 6 错误地将 z-index 应用于定位元素，而它们本应应用 auto。

除了不定位我的情况不可能的父级之外，没有其他方法可以逃避这一点，因为我希望它修复。

所以我需要更改设计并将渐变应用到另一个元素，而不是 100% 高固定元素。这将允许标题与内容分开，然后内容可以放在标题下。

【讨论】：