html - 无法删除上边距

Question

我有菜单:

<div class="col-sm-3 col-md-2 sidebar" style="background-color:white">
    <ul class="sideMenu nav nav-sidebar">
        <li class="dontHide"><a href="">Producers</a></li>
        <li><a href="/Manufacturer">Producers</a></li>
    </ul>
    <ul class="sideMenu nav nav-sidebar">
                <li class="dontHide"><a href="">Device library</a></li>
                <li><a href="/Device">Device list</a></li>
    </ul>
    <ul class="sideMenu nav nav-sidebar">
        <li class="dontHide"><a href="">Device Instances</a></li>
        <li><a href="/DeviceInstance">Device instances</a></li>
        <li><a href="/DeviceInstance/Summary">Instances summary</a></li>
    </ul>

</div>

这个菜单看起来像这样:

正如您在 hover 事件中看到的那样，背景颜色在 UL 和之前元素的 border-bottom 之间发生了一些变化。我试过 CSS:

.sidebar > ul{
    border-bottom: 1px solid #eee;
}
.sidebar > ul:hover{
    background-color:#f4f4f4;
}
.sidebar > ul> li > a{
    margin-top:0px
}

或者边距底部:

.sidebar > ul> li > a{
    margin-bottom:0px
}

你可以查看这个 JSfiddle CLICK什么时候您将能够看到我要删除的边距。

Answer 1

从 .nav-sidebar 中删除 margin-bottom