我在这里有一个简单的演示:
<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 5.1.3，属性float-end适用于我:
<div class="row mt-2 float-end">
<div class="col-md-12">
<button class="btn btn-warning" >Do something else</button>
<button class="btn btn-primary ml-2">Do primary action</button>
</div>
</div>
其他回答
在推特引导3尝试类右拉
class="btn pull-right"
很抱歉回答一个已经回答过的老问题，但我想我应该指出你的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>
(我还添加了一个最小宽度的按钮，因为我不能忍受一个粗糙的右对齐的按钮，因为不同的宽度:))
使用按钮标记代替输入，并使用右拉类。
右拉类完全混淆了你的两个按钮，但你可以通过在右侧定义自定义边距来解决这个问题。
<button class="btn btn-primary pull-right btn-sm RbtnMargin" type="button">Save</button>
<button class="btn btn-primary pull-right btn-sm" type="button">Cancel</button>
然后对类使用下面的CSS
.RbtnMargin { margin-left: 5px; }
你可以尝试一个自定义CSS除了引导CSS看看是否有任何变化。试一试
.move-rigth{
display: block;
float: right;
}
如果它起作用了，那么你可以尝试操纵你所拥有的或添加其他格式，从而实现你想要的。因为你在使用引导并不意味着如果它不能提供你想要的东西，那么你就可以管理它。你正在使用你的代码，所以你命令它按照你说的去做。 干杯!
添加到公认的答案，当在容器和列中工作时，从bootstrap中内置了填充，我有时会有一个完整的拉伸列，其中有一个子div，它可以进行拉取。
<div class="row">
<div class="col-sm-12">
<div class="pull-right">
<p>I am right aligned, factoring in container column padding</p>
</div>
</div>
</div>
或者，将所有列相加为网格列的总数(默认为12)，并偏移第一列。
<div class="row">
<div class="col-sm-4 col-sm-offset-4">
This content and its sibling..
</div>
<div class="col-sm-4">
are right aligned as a whole thanks to the offset on the first column and the sum of the columns used is the total available (12).
</div>
</div>
