bootstrap navbar even spacing

Question

我不知道如何在导航栏中设置均匀间距：

文章和用户Profil之间的差距比User Profil和Admin。

Admin和DB之间的差距比User Profil和Admin。

我的代码是：

<li class="blog-nav-item">
        <a class="blog-nav-item" href="#" class="blog-nav-item active" data-toggle="dropdown" role="button" aria-expanded="false">Articles<span class="caret"></span></a>
        <ul class="dropdown-menu" role="menu">
            <li><a href="/articles/create">All</a></li>
            <li><a href="/articles/create">Create New</a></li>
        </ul>
    </li>   

<a class="blog-nav-item" href="/accounts/profil/">User Profil</a></li>
<a class="blog-nav-item" href="/admin/">Admin</a></li>

<li class="blog-nav-item">
    <a href="#" class="blog-nav-item" data-toggle="dropdown" role="button" aria-expanded="false">DB<span class="caret"></span></a>
    <ul class="dropdown-menu" role="menu">
        <li><a href="/articles/api/article/?format=json">DB: JSON</a></li>
        <li><a href="/articles/api/article/?format=xml">DB: XML</a></li>
    </ul>
</li>     

Answer 1

这是因为默认情况下，简单列表元素和下拉菜单有不同的边距。

通过以下方式覆盖设置：

.blog-nav-item > a{
    margin-right:10px;
}
.blog-nav-item > .dropdown-menu{
    margin-right:10px;
}

将这些类添加到css将有所帮助