html - IE11 CSS - 悬停某些链接时导航 div 移动

Question

当我将鼠标悬停在导航链接“dienSTLeistungen etc.”上时在 IE11 中，导航 div 向下移动到底部有很大的余量。

我试过: - 从 boostrap.min.css 中的所有 boostrap col 中删除 position: relative。

同样的问题。有什么想法吗？

IE8 Works 和任何其他浏览器。

这是html:

<div class="col-sm-4 hidden-xs">
                <a href="index.html">
                    <img src="img/logo.jpg" align="middle" id="logo-lg" alt="Logo Lemag Treuhand">
                </a>
                <ul class="listMenuItem">
                    <li class="listMenuChild">
                        <a href="content/services.html" class="listMenuChild--title">Dienstleistungen</a>
                    </li>
                    <li class="listMenuChild">
                        <a href="content/about.html" class="listMenuChild--title">Über uns</a>

                    </li>
                    <li class="listMenuChild">
                        <a href="content/publications.html" class="listMenuChild--title">Publikationen </a>

                    </li>
                    <li class="listMenuChild">
                        <a href="content/tools.html" class="listMenuChild--title">Hilfsmittel </a>

                    </li>
                    <li class="listMenuChild">
                        <a href="content/contact.html" class="listMenuChild--title">Kontakt / Lageplan </a>
                    </li>

                </ul>
            </div>

CSS

/**
------------------
NAV
------------------
**/

.listMenuChild--title {
    font-size: 1.638em;
    margin-left: 20px;
}

.listMenuChild--subtitle {
    font-size: 14px;
    margin-right: -2px;
}

.sub-nav {
    margin-left: -7%;
}

.sub-nav li {
    list-style: none;
    margin-bottom: 2%;
    margin-top: 1%;
}

.listMenuChild {
    list-style-image: url("../img/bg_li.png");
    margin-top: 5%;
}

.listMenuChild--title:hover {
    list-style-image: url("../img/bg_li_h.png");
}

.listMenuChild:hover {
    list-style-image: url("../img/bg_li_h.png");
}

.active-bullet {
    list-style-image: url("../img/bg_li_h.png");
}

.actives {
    color: black;
}

.listMenuItem {
    margin-top: 18%;
    margin-left: 5%;
}

如果需要源码:

你找到了Here

Answer 1

尝试向 listMenuItem 添加一个 padding: 0px。看起来这可以解决问题，即使不清楚原因。也许它正在触发 IE 浏览器的 hasLayout 属性。