bootstrap新行11列

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

添加字體大小：在父DIV（.row）0，然後添加要對兒童的字體大小（.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; 
}