我有一个导航菜单，似乎我无法在< li>之间添加一个空格(margin：3px;)元素。
您可以在此jsfiddle或更低版本上看到HTML和CSS代码。
你会看到我添加了一个border-bottom：2px solid #fff;到#access li来模拟元素之间的空间，但这不会工作，因为在导航菜单下，我将有一堆不同的颜色。如果我添加margin-button：2px它不工作。
这是HTML：
<nav id="access" role="navigation">
<div class="menu-header-menu-container">
<ul id="menu-header-menu" class="menu">
<li id="menu-item-41" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-41">
<a href="http://localhost:8888/fullstream/?page_id=5">About Us</a>
</li>
<li id="menu-item-35" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-35">
<a href="http://localhost:8888/fullstream/?page_id=7">Services</a>
</li>
<li id="menu-item-34" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-34">
<a href="http://localhost:8888/fullstream/?page_id=9">Environmental Surface Cleaning</a>
</li>
<li id="menu-item-33" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-33">
<a href="http://localhost:8888/fullstream/?page_id=11">Regulations</a>
</li>
<li id="menu-item-32" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-32">
<a href="http://localhost:8888/fullstream/?page_id=13">Contact Us</a>
</li>
</ul>
</div>
这是CSS：
#access {
background: #0f84e8; /* Show a solid color for older browsers */
display: block;
margin: 0 auto 6px 55px;
position: absolute;
top: 100px;
z-index: 9999;
}
#access ul {
font-size: 13px;
list-style: none;
margin: 0 0 0 -0.8125em;
padding-left: 0;
}
#access li {
position: relative;
padding-left: 11px;
}
#access a {
border-bottom: 2px solid #fff;
color: #eee;
display: block;
line-height: 3.333em;
padding: 0 10px 0 20px;
text-decoration: none;
}
#access li:hover > a,#access ul ul :hover > a,#access a:focus {
background: #efefef;
}
#access li:hover > a,#access a:focus {
background: #f9f9f9; /* Show a solid color for older browsers */
background: -moz-linear-gradient(#f9f9f9,#e5e5e5);
background: -o-linear-gradient(#f9f9f9,#e5e5e5);
background: -webkit-gradient(linear,0% 0%,0% 100%,from(#f9f9f9),to(#e5e5e5)); /* Older webkit Syntax */
background: -webkit-linear-gradient(#f9f9f9,#e5e5e5);
color: #373737;
}
#access ul li:hover > ul {
display: block;
}
解决方法
加：
margin: 0 0 3px 0;
到你的#access li并移动
background: #0f84e8; /* Show a solid color for older browsers */
到#access a并取出边框底部。然后它会工作
