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

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

我有一个无序的列表和每个列表项目,我希望有文本在左边,然后一个右对齐按钮。我曾尝试使用拉右,但这完全混乱了对齐。我做错了什么?

<链接href=“http://twitter.github.com/bootstrap/assets/cssstrap.css”“terlesheet”/> <德> <li>One <输入级=“btn pullright”值=“测试”></li> <li> 2 < <输入级=“btn -right引体”值=“test2”</li> < /德>


当前回答

从Bootstrap V3.3.1开始,下面的CSS样式将解决这个问题

.modal-open{
    padding-right: 0 !important;
}

注意:我尝试了上面帖子中的所有建议,所有地址都是旧版本,不提供对新集引导版本的修复。

其他回答

自v3.1.0起,右拉权贬值。 只是提醒一下。

http://getbootstrap.com/components/#callout-dropdown-pull-right

在Bootstrap 4中:在Flexbox中尝试这种方式。参见getbootstrap中的文档

<div class="row">
  <div class="col-md">
    <div class="d-flex justify-content-end">
      <button type="button" class="btn btn-default">Example 1</button>
      <button type="button" class="btn btn-default">Example 2</button>
    </div>
  </div>
</div>

很抱歉回答一个已经回答过的老问题,但我想我应该指出你的jsfiddle不能工作的几个原因,以防其他人检查它并想知道为什么在接受的答案中描述的拉右类在那里不能工作。

the url to the bootstrap.css file is invalid. (perhaps it worked when you asked the question). you should add the attribute: type="button" to your input element, or it won't be rendered as a button - it will be rendered as an input box. Better yet, use the <button> element instead. Additionally, because pull-right uses floats, you will get some staggering of the button layout because each LI does not have enough height to accommodate the height of the button. Adding some line-height or min-height css to the LI would address that.

工作提琴:http://jsfiddle.net/3ejqufp6/

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

(我还添加了一个最小宽度的按钮,因为我不能忍受一个粗糙的右对齐的按钮,因为不同的宽度:))

在推特引导3尝试类右拉

class="btn pull-right"

对于引导5:

文档:https://getbootstrap.com/docs/5.0/utilities/float/

在元素中使用.float-end进行右对齐。 如果你将ex向右移动一个按钮,并且不希望下面的元素向上滑动,你可能必须在父元素中添加.clearfix。