Question

！（http://i.imgur.com/nyyRhJX.jpg）！ [互联网浏览器]

这个css适用于Safari，Chrome，Firefox，但即使在最新的IE 11中它仍然无法工作.Li的重叠，它会在列表的顶部创建一个空格。如果我摆脱了li的高度，文本就不再重叠了。相反，除非我设定一个高度，否则我会在每个li上得到大量的填充物。

如果我应该提供更多信息，请告诉我。谢谢。

以下是李的

.dropdown-menu > li {
    padding-left: 15px;
    height:25px;
    zoom:1;
    list-style:none;
    font-size:14px;
}
*, *::before, *::after{
    box-sizing:border-box;
}
.five-col{
    -moz-column-count:5;
    -webkit-column-count:5;
}
*********This is on the li > a
.dropdown-menu > li > a{
    display:block;
    padding:3px 20px;
    clear:both;
    font-weight:normal;
    line-height:1.428;
    white-space:nowrap;
}

********HTML is as follows
<div id="#category-list">
    <ul class="nav navbar-nav">
        <li>
            <a>Main Link</a>
            <ul class="dropdown">
                <li><a>link</a></li>
                <li><a>link</a></li>
                <li><a>link</a></li>
                ... etc.
            </ul>
        </li>
    </ul>
</div>

Answer 1

访问以下链接，它会对您有所帮助。

http://css3menu.com/neat-red.html#

Answer 2

我设法解决了这个可怕的错误，做了一个黑客（惊喜！）。

固定：内联块黑客攻击。 display：inline-block仅适用于自然显示的IE：inline;规则。如果不是这样，IE将处理声明的内联块元素。然后，在单独的规则中，再次将元素转回块。

教程在这里： http://www.kovioko.net/tutorial/extra-spacing-and-incorrect-height-on-list-items-in-internet-explorer

签出最后一个名为内联块黑客的解决方案，这是帮助我的解决方案。祝你好运。

制作水平响应菜单，在IE中重叠

2 个答案: