在Twitter中垂直居中内容Bootstrap网格系统

我没有找到在Twitter Bootstrap Grid系统中垂直居中内容的方法。 http://twitter.github.com/bootstrap/scaffolding.html#gridSystem 在Twitter中垂直居中内容Bootstrap网格系统

例如

<div class="row"> 
    <div class="span4" style="height:50px;min-height: 50px;">My centered object vertically</div> 
</div>

在span4 DIV对象将总是在div的顶部。我试图把vertical-align: middle;放在父母和孩子的Div's上，但是这并没有帮助。

来源

2013-03-22 Tomas

垂直对齐不被自举处理，因此它只是一个CSS米东北黑钙土。您可能会在[此问题]中找到一些信息（http://stackoverflow.com/q/11303461/1478467）或[this one]（http://stackoverflow.com/q/12882601/1478467） – Sherbrow 2013-03-22 08:47:13

使用的line-height或填充它...

像这样的line-height，

.line-height { line-height:30px; } 

<div class="row"> 
    <div class="span4 line-height">My centered object vertically</div> 
</div>

喜欢本作填充，50像素高度减去它与填补装置paddingtop +高度+ paddingBottom来= 50像素，

.padding { height:30px; padding:10px 0; } 

<div class="row"> 
    <div class="span4 padding">My centered object vertically</div> 
</div>

来源

2013-03-22 08:12:27 SaurabhLP

在Twitter中垂直居中内容Bootstrap网格系统

回答

相关问题