我怎样才能让我的Twitter Bootstrapbutton正确alignment？
我在这里有一个简单的演示：
http://jsfiddle.net/HdeZ3/1/
<ul> <li>One <input class="btn pull-right" value="test"></li> <li>Two <input class="btn pull-right" value="test2"></li> </ul> 我有一个无序的列表，对于每个列表项目，我希望在左边有文本，然后右alignment的button。 我试图使用拉右，但这完全混淆了alignment。 我究竟做错了什么？
pull-right插入类属性，并让引导程序排列button。
对于Bootstrap 2.3 ，请参阅： http ://getbootstrap.com/2.3.2/components.html#misc>帮助程序类> .pull右键。
对于Bootstrap 3 ，请参阅： http : //getbootstrap.com/css/#helper-classes > Helper类。
对于Bootstrap 4 ，请参阅： https ： //getbootstrap.com/docs/4.0/utilities/float/#responsive
pull-right命令被删除，并replace为float-right或一般float-right float-{sm,md,lg,xl}-{left,right,none}
在twitter引导3尝试类拉右
class="btn pull-right"
“拉右”类可能不是正确的方式，因为在使用“float：right”而不是文本alignment。
检查bootstrap 3 css文件，我发现457行上有“text-right”类。这个类应该是正确的文本alignment方式。
一些代码：
<div class="row"> <div class="col-xs-12"> <div class="text-right"> <button type="button" class="btn btn-default">Default</button> </div> </div> </div>
使用button标记，而不是input并使用pull-right类。
pull-right类完全混淆了你的两个button，但你可以通过在右侧定义自定义边距来解决这个问题。
<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; }
Bootstrap 3
使用pull-right类。
Bootstrap 4
pull-right类现在在Bootstrap 4中是float-right
<div class="row"> <div class="col-12">One <input type="button" class="btn float-right" value="test"></div> <div class="col-12">Two <input type="button" class="btn float-right" value="test"></div> </div>
http://www.codeply.com/go/nTobetXAwb
不要alignmentul列表和使用行元素块元素更好。
添加到接受的答案，当在从引导填充填充的容器和列中工作时，我有时会有一个完整的拉伸列，其中有一个子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>
对不起，我回答了一个较早已经回答的问题，但我想我会指出几个原因，你的jsfiddle不起作用，以防其他人检查出来，并想知道为什么接受的答案中描述的拉右类没有在那里工作。
- bootstrap.css文件的url无效。 （也许它在你问这个问题时起作用）。
- 你应该添加属性：type =“button”到你的input元素，否则它不会被渲染为一个button – 它将被渲染为一个input框。 更好的是，使用
<button>元素。 - 此外，因为拉右使用浮动，你会得到一些错综复杂的button布局，因为每个李没有足够的高度来容纳button的高度。 给LI添加一些行高或最小高度的CSS可以解决这个问题。
工作小提琴： 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，因为我不能忍受一个衣衫褴褛的右alignment的外观button，因为宽度变化:)）
使用引导pull-right帮助程序不适用于我们，因为它使用float: right ， 强制inline-block元素成为block 。 而当这些成为block ，它们失去了inline-block将它们提供为准文本元素的自然边界。
所以相反，我们使用direction: rtl; 在父元素上，这会导致元素中的文本从右到左进行布局，并导致inline-block元素从右向左布局。 你可以像下面那样使用LESS来防止儿童摆脱rtl ：
/* Flow the inline-block .btn starting from the right. */ .btn-container-right { direction: rtl; * { direction: ltr; } }
并使用它像：
<div class="btn-container-right"> <button class="btn">Click Me</button> </div>
应用pull-right类的button。 http://getbootstrap.com/css/#helper-classes-floats – > Helper类
这个链接将有所帮助
右起贬值从v3.1.0。 只是一个头。
http://getbootstrap.com/components/#callout-dropdown-pull-right
你可以尝试一个自定义CSS引导CSS CSS，看看是否有任何改变。 尝试
.move-rigth{ display: block; float: right; }
如果有效，那么你可以尝试操纵你所拥有的东西，或者添加其他的格式来实现你的愿望。 因为你使用bootstrap并不意味着它不提供你想要的东西，那么你只需要pipe理它。 你正在使用你的代码，所以你要命令它按你所说的去做。 干杯!
<ul> <li class="span4">One <input class="btn btn-small" value="test"></li> <li class="span4">Two <input class="btn btn-small " value="test2"</li> </ul>
我只是使用布局..应用样式的李..
要么
<ul> <li>One <input class="btn" value="test"></li> <li>Two <input class="btn" value="test2"</li> </ul>
在CSS中
li { line-height: 20px; margin: 5px; padding: 2px; }
现在，您需要将.dropdown-menu-right添加到现有的.dropdown-menu元素。 拉右不再支持。 更多信息在这里http://getbootstrap.com/components/#btn-dropdowns
您也可以使用空白列给左边的空格
喜欢
<div class="row"> <div class="col-md-8"></div> <!-- blank space increase or decrease it by column # --> <div class="col-md-4"> <button id="saveedit" name="saveedit" class="btn btn-success">Save</button> </div> </div>
Demo :: Jsfiddle演示
引导4 文档
<div class="row justify-content-end"> <div class="col-4"> Start of the row </div> <div class="col-4"> End of the row </div> </div>
