2014-10-30 61 views
0

我希望能夠將包含以下文本的div放在頁面中間。我雖然我將能夠使用「中心塊」級的引導,但它似乎並沒有工作:Bootstrap - 如何將包含文本的div放在中間?

實時預覽: http://codepen.io/anon/pen/tCIlG

Code below: 

<div class="row"> 
     <div class="col-md-4 center-block text-center"> 

     I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in. 

     </div> 
    </div> 
+0

可能重複[如何在div中水平居中div?](http://stackoverflow.com/questions/114543/how-to-horizo​​ntally-center-a-div-in-a-div) – Sasa 2014-10-30 22:37:13

回答

2

.col-md-4類使其漂浮而不是中心。如果你想保持寬度從類,你可以在CSS重寫它:

.col-md-4.center-block { 
    float: none; 
} 

更新codepen:http://codepen.io/sdsanders/pen/lHrvu

+0

謝謝你,那很容易。是使用列方法實現我想要做的最好的方法?還是有更好的方式來做到這一點,不需要添加在單獨的CSS等? – ifusion 2014-10-30 22:40:32

+1

@ifusion上面的答案是另一個不需要編寫任何CSS的選項。 – 2014-10-30 22:43:33

+0

你可能想避免黑客引導網格,只是抵消它如下 – 2014-10-31 22:52:13

2

在這裏你去

<div class="row"> 
 
     <div class="col-md-4 col-md-offset-4"> 
 

 
     I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in. 
 

 
     </div> 
 
    </div>

+0

真棒,謝謝馬特! – ifusion 2014-10-30 22:44:35

+0

@ifusion沒有問題,隨意標記爲接受的問題 – 2014-10-31 22:51:05

相關問題