twitter-bootstrap - 如何使 Twitter Bootstrap 按钮右对齐？

Question

我这里有一个简单的演示:

<ul>
    <li>One <input class="btn pull-right" value="test"></li>
    <li>Two <input class="btn pull-right" value="test2"></li>
</ul>

我有一个无序列表，对于每个列表项，我希望左侧有文本，然后有一个右对齐按钮。我尝试过使用向右拉，但这完全扰乱了对齐方式。我做错了什么？

<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" />
<ul>
  <li>One <input class="btn pull-right" value="test"></li>
  <li>Two <input class="btn  pull-right" value="test2" </li>
</ul>

Answer 1

将 pull-right 插入类属性中并让 bootstrap 排列按钮。

对于 Bootstrap 2.3，请参阅:http://getbootstrap.com/2.3.2/components.html#misc > 辅助类 > .pull-right。

<小时/>

对于Bootstrap 3，请参阅:https://getbootstrap.com/docs/3.3/css/#helper-classes > 辅助类。

<小时/>

对于Bootstrap 4，请参阅:https://getbootstrap.com/docs/4.0/utilities/float/#responsive

pull-right 命令已被删除，并替换为 float-right 或一般替换为 float-{sm,md,lg,xl}-{左、右、无}

<小时/>

对于 Boostrap 5，请参阅:https://getbootstrap.com/docs/5.0/utilities/float/

最接近的解决方案是float-end。