Измените размер div и центрируйте его с помощью бутстрапа

Question

У меня есть форма, обернутая граничным набором полей, теперь все поля формы заполняют ширину поля. Мне нужно, чтобы часть текстового поля была короче и центрирована. На данный момент я могу только сократить их, используя в примере col-md-10, но тогда я не знаю, как их центрировать, они остаются выровненными влево.

Вот как выглядят поля

<div class="form-group"> 
<label for="planner" class="control-label">form.planner *</label> 
<input class="form-control" id="planner" name="planner" type="text"> 

Кроме того, чтобы сформировать группу, я пытался добавить "Col-MD-10 центр-блок", но Didn» t help, я также пробовал несколько комбинаций, используя диапазон и смещение, но не повезло.

На следующем рисунке показано, что у меня есть и что я хочу, как я мог это сделать?

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

Answer 1

С col-md-10 Добавить класс col-md-offset-1 в центр col-md-10 элемент. Как это:

<div class="row"> 
    <div class="col-md-10 col-md-offset-1"> 
     I'm centered!! 
    </div> 
</div> 

Смещение классов, хорошо, смещение элемента по графу на имя класса, так и для сетки в 12 колонке, центрировать 10 Col элемента, при перемещении его через 1, следовательно col-md-offset-1 класс.

Например, чтобы центрировать элемент col-md-6, вы должны были бы компенсировать его тремя столбцами, используя класс col-md-offset-3.

Answer 2

Вы можете использовать col-md-offset-x или добавить еще один класс в div с классом col-md-x, а затем задать их свойства.

.center{ 
float:none; 
margin-left:auto; 
margin-right:auto; 
}