bootstrap new row 11 columns

Question

Я пытаюсь создать отзывчивый макет в Bootstrap с вертикально выровненными столбцами. Причина в том, что я хочу иметь несколько кнопок разных размеров на панели инструментов. Поиск способов сделать это, тот, который, кажется, работает лучше для меня что-то вроде этого codepen: http://codepen.io/anon/pen/VYpqLQ

По некоторым причинам, этот обычай стиль «Поплавок: ни один» не кажется, что делает самозагрузки перерыв в новую строку на 11 столбцов вместо 12. Почему это может быть?

Спасибо!

.verti-align { 
    border: solid 1px blue; 
} 

.verti-align > [class^="col-"], 
.verti-align > [class*=" col-"] { 
    display: inline-block !important; 
    border: solid 1px red; 
    vertical-align: middle; 
    float: none; 
} 

---

<div class="row verti-align"> 
    <div class="col-xs-6 col-md-3">.col-md-3<br><br></div> 
    <div class="col-xs-5 col-md-3">.col-md-3</div> 
    <div class="col-xs-6 col-md-3">.col-md-3<br><br></div> 
    <div class="col-xs-5 col-md-3">.col-md-3 change it to 2 and it works</div> 
</div> 

Answer 1

Добавить размер шрифта: 0 на родительском DIV (.row) и добавьте размер шрифта вы хотите на детей (.col-)

.verti-align { 
     border: solid 1px blue; 
     font-size:0; 
    } 

.verti-align > [class^="col-"], 
.verti-align > [class*=" col-"] { 
    display: inline-block !important; 
    border: solid 1px red; 
    vertical-align: middle; 
    float: none; 
    font-size:15px; 
}