Центр div, когда он занимает 12 столбцов в bootstrap

Question

У меня есть элемент в строке Bootstrap. Элемент принимает разное количество столбцов на конфигурациях xs, sm, md и lg экрана. Мне нужно, чтобы элемент находился посередине, когда требуется 12 столбцов. Является ли это возможным? Если да, то как я могу это сделать? Например:

<div class="row"> 
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-4"> 
    SOME TEXT 
</div> 
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-4"> 
    SOME TEXT 
</div> 
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-4"> 
    SOME TEXT 
</div> 

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

Answer 1

Oh! Там я вышел с этой идеей, и, похоже, это сработало. Я просто добавить немного CSS до элементов, которые принимают столбцы:

margin:0 auto; 

и то, что код делает фактически центрирует элементы в их столбцах.

Answer 2

Да, @GaneshRadhakrishnan правильно, вы должны использовать center-text класс Bootstrap как это:

<div class="row"> 
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 center-text"> 
     SOME TEXT 
    </div> 
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 center-text"> 
     SOME TEXT 
    </div> 
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 center-text"> 
     SOME TEXT 
    </div> 
</div>