答案 0 :(得分：0)
问题是<a>元素中的每个锚标记<li>在两边都有边框...
要解决此问题，请在此处添加border-right-width：
.main-navigation li a {
border-right-width: 1px solid #F9B233;
}
并删除上面选择器中的以下属性：
border-width: 1px solid #F9B233;
要删除最后一个元素的右边框，您可以执行以下操作：
.main-navigation li:last-child a
{
border-right-width: 0;
}
答案 1 :(得分：0)
因为您将列表元素设置为内联块。它在每个元素之间创建空格，就像它的文本一样（单词之间应该有空格，如果你考虑它就有意义。）
.nav-menu {
font-size: 0;
}
只需确保重置子项上的字体大小，否则它们将继承此大小并且难以辨认。
答案 2 :(得分：0)
我没有看到你正在谈论的空间，但我之前发生过类似的事情。
CSS Box Model Puzzle - I must be missing something
关键是以下的css代码：
box-sizing: border-box; /* needs prefixes for webkit/moz */
尝试将此css属性包含在您可能拥有的容器div中。
希望这有帮助！