做了水平响应式菜单,李在IE中的重叠



!(https://i.stack.imgur.com/NP0GT.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>

访问下面的链接,它将对您有所帮助。

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

我通过ie破解(惊喜!)成功解决了这个可怕的错误。

修复:内联块破解。display:inline块仅适用于自然具有display:iinline的IE;规则如果不是这种情况,IE将处理声明的内联块元素。然后,在一个单独的规则中,再次将元素变回块。

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

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

最新更新