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

Question

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

http://resume.jamesfishwick.com/

布局按照我的要求在FF和Chrome中运行，但页面内容在IE7中滚动固定的上部区域。

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

如何在IE7中实现这一目标？

Answer 1

你需要给滚动div一个z-index，它小于主标题上的z-index。要控制msie 7的透明度，只需将以下css代码添加到文档末尾，然后在＆lt; / body＆gt;之前添加。标签

/* ie6 hack */
* html .gradientLayer { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/path_to_images/mygradient.png', sizingMethod='scale')); }
/* ie7 hack */
*+ html .gradientLayer { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/path_to_images/mygradient.png', sizingMethod='scale')); }

Answer 2

在IE7中，元素被其定位的父元素捕获，无法转义。一个人不能交配定位父母的孩子，因为当他们应该应用auto时，ie7和6错误地将z-index为零应用于定位元素。

没有办法逃避这个，除了没有定位我的情况不可能的父母，因为我想要它修复。

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