IE7中z-index相关问题解决办法 (z-index problem on IE7 solution)

开发一个页面，页面中有两个临近的元素，上边的是一个导航下拉菜单，下边的是一个jquery-ui的slider。在FF和Chrome中都可正常显示，但是在IE7中，本应被下拉菜单遮住的slider反而出现在菜单的前面。

这是由于一个IE7的bug：“In Internet Explorer positioned elements generate a new stacking context, starting with a z-index value of 0. Therefore z-index doesn’t work correctly”，所以IE7不能正确处理不同的设置了position属性的页面元素下的子元素的z-index顺序，常常导致z-index序号大的子元素反而被另一页面元素下z-index序号小的子元素所覆盖。

一种解决办法是：设置z-index序号大的子元素的父元素的z-index属性，赋一个更大的序号。这个办法解决了上面提到的导航下拉菜单和slider在IE7中的显示问题。至于为什么有效，不知其所以然。。。

参考于这篇博文：http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/