щебетать формы начальной загрузки

Question

У меня есть встроенная форма с Bootstrap 2.0.1 - эта форма имеет 3 метки и 3 выпадающих списка ...

То, что я пытаюсь сделать, это растянуть выпадающие списки таким образом, чтобы первый был слева, а третий - справа от содержащего элемента div .... Я могу сделать это с помощью некоторого float влево и вправо но мне было интересно, есть ли что-то подобное уже встроенное?

Мысли

Код выглядит так

<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

Взгляните на раздел «Ширина жидкости» на странице «Строительные леса» в документации по Bootstrap в Twitter: http://twitter.github.com/bootstrap/scaffolding.html Вам понадобится воспользоваться классами span и row-fluid, чтобы перейти к выбранным элементам управления в форме изменяемой ширины.

Вот пример:

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

Вот приведенный выше пример для jsFiddle: http://jsfiddle.net/CdNef/

Вот тот же пример с метками, встроенными, а не поверх выпадающего списка: http://jsfiddle.net/gbumP/