徽章Bootstrap：在导航栏左侧对齐

Question

我在Bootstrap 3.3.5和我的徽章Css上遇到了一个小问题：

我的Html代码：

<div class="collapse navbar-collapse navbar-vertical-principal" id="nav-index">
<div class="nav-group">
    <ul class="nav navbar-nav" id="nav-index">
        <li>
            <a href="/app_dev.php/utilisateur/cabinet/2/copropriete/14/remise-cheque">
            Remises de chèques
            <span class="badge pull-right  badge-blue ">0</span>
            <span class="badge pull-right  badge-green "><i class="fa fa-check"></i> </span>
            </a>
        </li>
        <li>
            <a href="/app_dev.php/utilisateur/cabinet/2/copropriete/14/remise-prelevement">
            Remises de prélèvements SEPA
            <span class="badge pull-right  badge-blue ">0</span>
            <span class="badge pull-right  badge-green "><i class="fa fa-check"></i> </span>
            </a>
        </li>
        <li>
            <a href="/app_dev.php/utilisateur/cabinet/2/copropriete/14/remise-virement">
            Remises de virements SEPA
            <span class="badge pull-right  badge-blue ">0</span>
            <span class="badge pull-right  badge-green "><i class="fa fa-check"></i> </span>
            </a>
        </li>
    </ul>
</div>

我的自定义Css：

.navbar-vertical-principal .nav-group {
    padding: 5px
}
.navbar-vertical-principal .navbar-nav {
    float: none;
    margin: 0
}
.navbar-vertical-principal .navbar-nav > li {
    float: none;
    margin: 0 -5px
}
.navbar-vertical-principal ul li a {
    padding: 7.5px;
    display: block
}
.navbar-vertical-principal ul li a span.badge {
    margin-left: 5px;
}

你能帮帮我吗？我只是想在左边对齐我的徽章（和响应）。谢谢:)）

Answer 1

在锚之前移动并移除拉力

    <li>
        <a href="/app_dev.php/utilisateur/cabinet/2/copropriete/14/remise-cheque">
        <span class="badge   badge-blue ">0</span>
        <span class="badge   badge-green ">
        Remises de chèques
        <i class="fa fa-check"></i> </span>
        </a>
    </li>