How can I get my Twitter Bootstrap buttons to right align?

bootstrap-4, twitter-bootstrap, twitter-bootstrap-2, twitter-bootstrap-3

Solution

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}`

For Boostrap 5, see: https://getbootstrap.com/docs/5.0/utilities/float/

The closest solution would be `float-end`.

Problem

I have a simple demo here: ``` <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? ``` <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> ```

Original source