Css 我导航栏上奇怪的下边距

在.nav wrapper>ul上似乎有一个底部边距，但除了给它一个定义的高度（我不想这么做），我不知道如何去掉它。有人能帮我把这个拧紧吗

根据我的计算，它应该在李的底部休息

不得不用Google URL Shortener包装链接，因为它想让我包含代码…但这不会发生，因为它太多了

---

您的问题在于.nav wrapper ul元素上的间距固定：

.nav-wrapper ul:after {
    content: '';
    display: inline-block;
    width: 100%;
}

这是在列表元素下面创建一个元素，并创建该空空间。 通过将其更改为以下内容，您可以看到此操作：

.nav-wrapper ul:after {
    content: '';
    display: block;
    width: 100%;
    height:0px;
}

但是你会失去你拥有的美好空间

不幸的是，这种分隔

li

项的方法会产生下面的空白的副作用，因此您唯一的选择是更改分隔

li

元素的方式

我建议采用以下方法：

nav-wrapper li {
    display: block;
    text-align: center;
    background: none;
    transition: background-color 300ms ease;
    width: 16.6666667%;
    float: left;
}

.nav-wrapper a {
    position: relative;
    display: inline-block;
    width: 128px;
    text-decoration: none;
    color: white;
    padding: 10px 0;
    background: #34495e;
    transition: background-color 300ms ease;
}

.nav-wrapper li a:hover {
    background: #d5051d;
}

---

该死。我知道没有太多的方法来均匀地分配李的空间。谢谢你的帮助。我会试着想出另一个办法。