2012-09-14 22 views
13

Bootstrap tiene un montón de examples for types of forms. Estoy interesado en el uso de la "forma horizontal", que se parece a esto¿Cómo puede hacer que las etiquetas de forma horizontal de Bootstrap sean más pequeñas con CSS?

Picture.png http://img35.imageshack.us/img35/244/picturebm.png

Esto es lo que parece después de esbozar algunos elementos con la barra de herramientas Web Inspector:

Picture 2.png http://img594.imageshack.us/img594/4681/picture2yn.png

I Estoy trabajando dentro de una ventana emergente modal y el espacio ya es un poco apretado. Traté de agregar el sistema de cuadrícula de bootstrap .span1 y .span2 a las etiquetas como una clase, pero no está dando el comportamiento deseado.

¿Hay alguna manera de utilizar algún otro aspecto de bootstrap para obtener el comportamiento deseado (es decir, ajustar la cantidad de espacio que ocupan las etiquetas en una forma horizontal)? ¿Cuál es la forma apropiada de hacer esto? Estoy usando la versión de arranque 2.1

Respuesta

12

No estoy al tanto si de arranque tiene algo definido para it..below es una solución ..

<div class="control-group"> 
<label class="control-label" style="width:auto" for="inputEmail">Email</label> 
<div class="controls" style="margin-left:auto"> 
<input type="text" class="input-small" id="inputEmail" placeholder="Email"> 
</div> 
</div> 

he añadido style="width:auto" que era por defecto 140px y style="margin-left:auto" que era por defecto 160px. También class="input-small" para reducir el ancho campo de entrada para exprimir más espacio para que quepa en modal ..

Ahora usted ajustar aún más para que se ajuste según sus necesidades ..

+2

parece que funcionaría - Estoy bootstrap sorpresa no tiene un mejor soporte incorporado para esto. Gracias – cwd

Cuestiones relacionadas