IE 6悬停导航问题

时间:2009-11-09 10:00:17

标签: css internet-explorer-6

我在主导航中使用子导航的网站导航...唯一的问题是,在IE6中,子菜单将其他菜单项推到一边,导致布局中断并弄乱用户的视图该网站。

我正在使用计算出的HTML:

<li class="ulHover">
   <a></a>
   <div class="subMenuTop"></div>
   <ul class="subMenu">
      <li></li>
      <li></li>
   </ul>
</li>

和css:

li .ulHover
{
    width: 113px;
    height: 71px;
    background: transparent url(../images/MenuItemBgHover.png) no-repeat top right;
    text-align: right;
    float:left;
    vertical-align: bottom;
}
.subMenu
{
    background: #B02229;
    padding: 0px 5px 5px 5px;
    text-align:left;
    width: 215px;
    list-style: none;
    margin-left: 1px;
    position:absolute;
    display:none;
    z-index: 10000;
}

.subMenuTop
{
    width: 225px;
    height: 10px;
    background: transparent url("../images/SubMenuTop.png") no-repeat top left;
    margin-left: 1px;
    margin-top: -3px;
    display:none;
    z-index: 10000;
}

编辑:好的,我在div中添加了绝对定位...它会阻止顶层列表项被推开......但是子菜单的偏移是远离...只在IE6中,在另一个中浏览器,它确实有用......

2 个答案:

答案 0 :(得分:1)

您的代码中未关闭submenuTop div。这可能是解决问题的第一步。

答案 1 :(得分:1)

我猜这是一个横向菜单。那是对的吗?你有没有尝试将div位置设置为“绝对”而不是ul?以下是一个可能对您有所帮助的示例:http://www.armbruster-baeckerei.de/philosophie.php