下拉菜单未在IE中显示(隐藏在内容后面)

Question

我很难过.香港专业教育学院试图把位置:相对和各种z指数无济于事.下面是我的简单下拉菜单的代码.它在除IE之外的每个浏览器中都能正常工

html页面:

    <div id="nav">
 <ul id="navul">
  <li id="rootHome">
    <ul id="Home"></ul><a href="index.php"><img src="images/LA-icon.png" style=
    "height: 40px;" id="home" /></a>
  </li>
  <li id="rootProducts" onclick="showMenu(this)">Products
    <ul id="Products">
      <li>
        <p class="navLink" onclick="changePage('products-1.php')">Product 1</p>
      </li>
      <li>
        <p class="navLink" onclick="changePage('products-2.php')">Product 2</p>
      </li>

      <li>
        <p class="navLink" onclick="changePage('products-3.php')">Product 3</p>
      </li>
    </ul>
  </li>
  <li id="rootNews">
    <a href="#Link for news" class="navLink">News</a>
  </li>
  <li id="rootCompany" onclick="showMenu(this)">Company &acirc;&circ;&uml;
    <ul id="Company">
      <li>
        <p class="navLink" onclick="changePage('./company-aboutUs.php')">About Us</p>
      </li>
      <li>
        <p class="navLink" onclick="changePage('./company-contactUs.php')">Contact
        Us</p>
      </li>
    </ul>
  </li>
</ul>

CSS :(格式化在这里不起作用) http://pastebin.com/raw.php?i=CjyQhXCs

Answer 1

尝试使用position: relative和z-index: 100在id=navdiv上.Z索引分层工作.如果元素的父元素的z-index为0,并且该元素的z-index为100,则该元素仍将出现在另一个元素的后面,该元素是z-index为1的父元素的兄弟.

问题是使用filter#navul ul 的直接结果.在其计算的某处,IE使元素自动隐藏任何溢出.要修复,将背景移动到自己的元素并绝对定位它.

http://jsfiddle.net/uTBZN/30/

归功于:

如何阻止Internet Explorer的专有渐变过滤器切断应该溢出的内容？