IE7下面踩得坑

bug1.position:fixed;z-index:99;

出现了z-index:2的层级跑到他上面了,

为什么?会出现这问题???

检查:

1你的固定定位的容器是不是被其他容器包裹,你包裹得容器是不是加了层级,

<div class="header" style="100%;height:200px">

  <div class="nav" style="position:fixed;left:0;top:0;z-index:99;100%;height:100px"></div>

</div>

<div class="main" style="100%;height:500px;position:relative">

  <div class="content" style="position:absolute;top:0;left:0;100%;height:200px"></div>

</div>

如果你是这样的你会出现,第二个容器的content在第一个容器上面这个bug就产生了

解决方式,

1你可以吧nav移出容器header之外保持header,nav,main在同一级就不会有问题了

2给header加position:relative;z-index:99也可以解决

bug2:

<ul>

  <li></li>

  <li></li>

  <div></div>

</ul>

以上ul li中间被任何元素隔绝都是IE7下的bug

日常所遇,随手而记。
原文地址:https://www.cnblogs.com/zhihou/p/6610502.html