Twitter tramo formulario en línea de arranque

Question

Tengo un formulario en línea con Bootstrap 2.0.1 - esta forma cuenta con 3 etiquetas y 3 menús desplegables ...

Lo que estoy tratando de hacer es estirar los menús desplegables de una manera que el primero está a la izquierda y el tercero está a la derecha del div que contiene ... Puedo hacerlo a través de un flotador de izquierda a derecha, pero me pregunto si ya hay algo así como incorporado.

¿Pensamientos?

El código es el siguiente

<form id="frmOptions" method="post" class="form-inline"> 
    <label>Option 1:</label> 
    <select>---</select> 

    <label>Option 2:</label> 
    <select>---</select> 

    <label>Option 3:</label> 
    <select>---</select> 
</form> 

Answer 1

Tome un vistazo a la anchura de la sección de fluido de la página Andamio de la documentación Twitter Bootstrap: http://twitter.github.com/bootstrap/scaffolding.html Usted tendrá que tomar ventaja de las clases span y row-fluid al siguiente sus controles de selección en una forma de ancho de fluido.

Aquí está un ejemplo:

<div id="wrapper" class="container-fluid"> 
<div class="row-fluid"> 
<form id="frmOptions" method="post" class="well form-inline span12"> 

    <div class="row-fluid"> 
     <div id="formLeft" class="span3"> 
      <div class="control-group"> 
      <label for="select1" class="control-label">Option 1:</label> 
      <div class="controls"> 
       <select id="select1"> 
        <option>Something</option> 
       </select> 
      </div>  
      </div> 
     </div> 

     <div id="formCenter" class="span3"> 
      <div class="control-group"> 
      <label for="select2" class="control-label">Option 2:</label> 
      <div class="controls"> 
       <select id="select2"> 
        <option>Something</option> 
       </select> 
      </div>  
      </div>  
     </div> 

     <div id="formRight" class="span3"> 
      <div class="control-group"> 
      <label for="select3" class="control-label">Option 3:</label> 
      <div class="controls"> 
       <select id="select3"> 
        <option>Something</option> 
       </select> 
      </div>  
      </div>  
    </div> 

</form> 
</div> 
</div> 

Aquí está el ejemplo anterior en jsFiddle: http://jsfiddle.net/CdNef/

aquí es el mismo ejemplo con las etiquetas en línea, en lugar de en la parte superior de la lista desplegable: http://jsfiddle.net/gbumP/