中心在twitter引導中對齊一列

Question

我已經開始學習Bootstrap。我的問題是如何居中對齊列水平，bootstrap包含12列布局，沒有中間數字。爲了更清楚，如果是11列布局，中間的數字將是6（5列左，1列中，5列右）

Answer 1

問題是正確這裏Center a column using Twitter Bootstrap 3

回答對於奇數行：即COL-MD-7或COL-large- 9使用這個

添加col-centered到你想居中的列。

<div class="col-lg-11 col-centered">  

並添加到您的樣式表：

.col-centered{ 
float: none; 
margin: 0 auto; 
} 

對於偶數行：即COL-MD-6或COL-大-10使用本

只需使用自舉3的偏移col類。即，

<div class="col-lg-10 col-lg-offset-1"> 

Answer 2

自舉3去實現你想要什麼是最好的方式。 ..與偏移列。請看看這些例子更多細節：
http://getbootstrap.com/css/#grid-offsetting

總之，沒有在這裏看到你的div是一個例子什麼可能的幫助，而無需使用任何自定義類。只要注意如何「COL-6」的使用和如何有一半是3 ...這樣的「偏移3」一詞。拆分同樣將允許中心間距你打算爲：

<div class="container"> 
<div class="col-sm-6 col-sm-offset-3"> 
your centered, floating column 
</div></div> 

Answer 3

如果你不能把1列，你可以簡單地把2列中間... （我只是合併的答案） 自舉3

<div class="row"> 
    <div class="col-lg-5 ">5 columns left</div> 
    <div class="col-lg-2 col-centered">2 column middle</div> 
    <div class="col-lg-5">5 columns right</div> 
</div> 

即使你可以通過添加這對風格的文本中心柱：

.col-centered{ 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center; 
} 

此外，還有另一種解決方案here

Answer 4

我嘗試了上面給出的方法，但這些方法在動態增加其中一個列的內容的高度時失敗，它基本上將其他列降低。

對我來說，基本的表格佈局解決方案起作用。

// Apply this to the enclosing row 
.row-centered { 
    text-align: center; 
    display: table-row; 
} 
// Apply this to the cols within the row 
.col-centered { 
    display: table-cell; 
    float: none; 
    vertical-align: top; 
}