¿Cómo puedo hacer que mis botones de Twitter Bootstrap se alineen a la derecha?

Tengo una simple demostración aquí:

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>

Tengo una lista desordenada y para cada elemento de la lista deseo tener texto a la izquierda y luego un botón alineado a la derecha. He tratado de usar pull-right pero esto desordena completamente la alineación. ¿Qué estoy haciendo mal?

Zim
Pregunta editada 18º mayo 2017 в 10:07
Programación
twitter-bootstrap-2 twitter-bootstrap-3 twitter-bootstrap bootstrap-4
16º marzo 2013 в 6:11
14 vistas
Solución

Inserta pull-right en el atributo de clase y deja que bootstrap organice los botones.

Para Bootstrap 2.3, véase: http://getbootstrap.com/2.3.2/components.html#misc > Helper classes > .pull-right.

Para Bootstrap 3, ver: https://getbootstrap.com/docs/3.3/css/#helper-classes > Helper classes.

Para Bootstrap 4, véase: https://getbootstrap.com/docs/4.0/utilities/float/#responsive

Se ha eliminado el comando pull-right y se ha sustituido por float-right o en general por float-{sm,md,lg,xl}-{left,right,none}.

zwl
Respuesta editada 29º marzo 2018 в 7:34
Comentarios (4)
 
<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>

Acabo de utilizar layout..apply styles para li..

o

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

en CSS

li {
    line-height: 20px;
    margin: 5px;
    padding: 2px;
}
sasi
Respuesta editada 16º marzo 2013 в 6:29
Comentarios (2)

Puedes probar con un CSS personalizado aparte del CSS de bootstrap para ver si hay algún cambio. Prueba con

.move-rigth{
    display: block;
    float: right;
}

Si funciona entonces puedes probar a manipular lo que tienes o añadir otro formato a este y conseguir lo que deseas. Porque usted está utilizando bootstrap doesn't significa que si doesn't ofrecen lo que usted quiere entonces usted acaba de manejar. Estás trabajando con tus códigos y así le ordenas que haga lo que tú dices. ¡Saludos!

Comentarios (2)