1

鼠标悬停时,Internet Explorer 9.0.8上的菜单大小会增加。我发现原因是该元素divider正在使用该属性overflow:hidden

为什么鼠标悬停时会影响元素?

这是代码的小提琴。我在第一个 CSS 样式中指出了问题所在。 http://jsfiddle.net/EF9Eg/4/

这是有问题的风格:

.floatingMenu li.divider{
    height: 1px;
    margin: 9px 1px;
    overflow:hidden;  /*PROBLEM INTERNET EXPLORER*/
    background-color: #E5E5E5;
    border-bottom: 1px solid #FFF;
}

如果我们摆脱overflow:hidden;一切运作良好。

4

2 回答 2

1

它的发生似乎是基于对 IE 的 100% 宽度部分以及 div 定义该大小的替代解释。

没有设置或最大宽度的 div 或 ul 中的 100% 宽度可以解释为它嵌套的最大 div 的宽度,这似乎正在发生。如果您删除 100% 宽度或对 ul 应用 set 或 max-width,它会将其限制为该分层宽度。

这也可能部分是应用于 ul 的绝对定位的一个因素,因为它可能会忽略相对定位的 div 的宽度高于其自身。

我相信进一步解释了正在发生的事情。

于 2013-05-16T17:38:51.460 回答
0

当您从 .floatingMenu li 中删除 width:100% 时,问题消失了

于 2013-05-16T16:08:02.700 回答