How can I get my Twitter Bootstrap buttons to right align?
I have a simple demo here:
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>
I have an unordered list and for each list item I wish to have text on the left and then a right aligned button. I have tried to use pull-right but this completely messes up the alignment. What am I doing wrong?
Insert pull-right into the class attribute and let bootstrap arrange the buttons.
For Bootstrap 2.3 , see: http://getbootstrap.com/2.3.2/components.html#misc > Helper classes > .pull-right.
For Bootstrap 3 , see: https://getbootstrap.com/docs/3.3/css/#helper-classes > Helper classes.
For Bootstrap 4 , see: https://getbootstrap.com/docs/4.0/utilities/float/#responsive
The pull-right command was removed and replaced with float-right or in general to float-{sm,md,lg,xl}-{left,right,none}
在twitter引导3尝试类拉右
class="btn pull-right"
"pull-right" class may not be the right way because in uses "float: right" instead of text-align.
Checking the bootstrap 3 css file i found "text-right" class on line 457. This class should be the right way to align the text to the right.
Some code:
<div class="row">
<div class="col-xs-12">
<div class="text-right">
<button type="button" class="btn btn-default">Default</button>
</div>
</div>
</div>