IE 6 & IE 7 Z-Index Problem

2020-01-24 03:51发布

http://madisonlane.businesscatalyst.com

I'm trying to get the div#sign-post to sit above the div#bottom. This works fine in all browsers except IE6 & IE7. Can anyone see what the problem is here?

Also IE6 is displaying an additional 198px to the top of div#bottom.

7条回答
在下西门庆
2楼-- · 2020-01-24 04:32

I just had this problem and the fix I found (thanks to Quirksmode) was to give the direct parent of the node you are trying to set a z-index of it's own z-index that is at less than the z-index of the node you are trying to set. Here is a quick example that should work in IE6

<html>
  <head>
    <style type="text/css">
      #AlwaysOnTop {
        background-color: red;
        color: white;
        width: 300px;
        position: fixed;
        top: 0;
        z-index: 2;
      }
      #Header {
        color: white;
        width: 100%;
        text-align: center;
        z-index: 1;
      }
    </style>
  </head>
  <body>
    <div id="Header">
      <div id="AlwaysOnTop">This will always be on top</div>
    </div>
    <div id="Content">Some long amount of text to produce a scroll bar</div>
  </body>
</html>
查看更多
登录 后发表回答