Как поместить значение элемента select в центральное положение в фреймворке Bootstrap

#css #twitter-bootstrap

#css #twitter-bootstrap

Вопрос:

Я хочу расположить значение select элемента по центру. Я использую Twitter Bootstrap.

Обычно для других элементов мы можем добавить к ним text-center класс. Однако это не работает при применении этого класса к элементу select. Если я добавлю класс к каждому из параметров, содержащихся в элементе select, это все равно не сработает.

Вот фрагмент кода и изображение:

 <div class="col-sm-2">
  <select class="form-control text-center" ng-model="immunization['D2002.35']">
    <option value=""></option>
    <option value="Yes" class="text-center">Yes</option>
    <option value="No" class="text-center">No</option>
  `enter code here`</select>
</div>
  

введите описание изображения здесь

Комментарии:

1. Лучше не использовать css, который написан нами самими. Я просто хочу знать, есть ли в фреймворке bootstrap решение, подходящее для этой ситуации. Большое вам спасибо.

Ответ №1:

Насколько я знаю, для этого не существует специальных классов начальной загрузки.

Но решение кажется довольно простым:

 option {
  text-align: left;
}
select {
  text-align-last: center;
  text-align: center;
}
  

JSFiddle для демонстрации здесь.