Элементы элементов ввода элементов переполнения бутстрапа?

Question

Here is an example on jsbin

Я пытаюсь использовать систему сетки бутстрапа, и я нахожу, что элементы ввода пропускают ячейки сетки. Есть ли что-то, что я должен сделать, чтобы это предотвратить? Вот HTML:

<div class="container"> 
    <div class="row-fluid"> 
     <div class="span8"></div> 
     <div class="span2">per Invoice</div> 
     <div class="span2">per LB</div> 
    </div> 

    <div class="row-fluid"> 
     <div class="span8"> 
     <select> 
     </select> 
     </div> 
     <div class="span2"> 
     <input> 
     </div> 
     <div class="span2"> 
     <input> 
     </div> 
    </div> 
</div> 

Я знаю, что установка input,select,textarea { max-length: 100%} устраняет проблему, но это кажется странным надзор от имени Bootstrap в. Достаточно странно, что, вероятно, я делаю что-то неправильно.

Answer 1

Я думаю, вы спрашиваете, возможно ли ограничить количество символов, которые могут быть введены в поле ввода. Если нет, то извиняюсь. Это, как вы могли бы сделать, что:

<input data-bind="" maxlength="10"> 

Это устанавливает максимальное количество символов, которые можно вводить в это поле до 10, или что-то целое число вы хотите, чтобы положить туда.

EDIT:

Или, если проблема заключается в том, что поле ввода визуально слишком долго, вы можете сделать следующее:

<div class="container"> 

    <div class="row-fluid"> 
     <div class="span7"></div> 
     <div class="span2">per Invoice</div> 
     <div class="span2 offset1">per LB</div> 
    </div> 

    <div class="row-fluid"> 
     <div class="span7"> 
     <select> 
      <option>Suggested Freight - <span></span></option> 
      <option>Enter Freight</option> 
     </select> 
     </div> 
     <div class="span2"> 
     <input data-bind="" maxlength="10"> 
     </div> 
     <div class="span2 offset1"> 
     <input data-bind="" maxlength="10"> 
     </div> 
    </div> 
</div> 

Это только пробелы его вне немножко и поля остаются в пределах указанную сетку. Надеюсь, это то, что вы искали.

Answer 2

Если вы хотите, чтобы ваши входы соответствовали сетке, вы можете дать класс span вашим входам.

<input data-bind="" class="span12">