bootstrap：在下拉按钮中对齐列表元素

Question

有一组带有下拉列表的按钮：

<div class="btn-group">
    <button class="btn">
        Some text
    </button>

    <button class="btn dropdown-toggle" data-toggle="dropdown">
        <span class="caret"></span>
    </button>

    <ul class="dropdown-menu">
        <li><a href='#'>Item1  Value1</a></li>
        <li><a href='#'>Another_Item Value1</a></li>
    </ul>
</div>

如何让Item左对齐，Value - 在右边？ （使用Twitter Bootstrap类）

Answer 1

Bootstrap中没有类，但您可以为此添加样式

<button class="btn btn-width-text">
    Some text
</button>

<button class="btn dropdown-toggle btn-with-caret" data-toggle="dropdown">
    <span class="caret"></span>
</button>

.btn-width-text{
  float: right;
  border-radius: 0 4px 4px 0;
}

.btn-with-caret{
  border-radius: 4px 0 0 4px;
}