如何垂直居中div？

问题描述：

我有两列（div { float: left; }，你可能知道）在Bootstrap结构中。问题是让一个div内的内容走到中间（垂直）。所以，第二列的高度并不重要，第二列总是在中间。如何垂直居中div？

这不是一行文字。在我的情况下将是一个图像和一个标题。两个元素的块。

这里的例子：http://jsfiddle.net/almino_melo/L4rK5/。

我试图把另一个div内配置有display: table;规则，然后另外一个与display: table-cell;和vertical-align: middle;。但它没有奏效。

请不要链接到JSFiddles，除非支持您的问题。您的问题需要负责，无需打开任何外部链接;因为它没有人可以在没有首先打开JSFiddle的情况下回答这个问题。 – meagar 2013-03-21 20:18:10

如果你有一行文字，你可以使用：http://stackoverflow.com/questions/10061339/how-do-i-align-text-to-the-middle-of-an-element-with-css- in-twitter-bootstrap – Kamil 2013-03-21 20:29:44

我会尽力解决这个问题。 – 2013-03-22 23:33:54

答

这里是我更新的小提琴http://jsfiddle.net/L4rK5/9/，它会按照你的要求做，但看起来真的很粗糙，请注意html div结构以及下面的css规则的变化。

.text-center{ 
    width: 100%; 
    position: absolute; 
    top: 50%; 
}

如何垂直居中div？

相关推荐