在简单的div内垂直对齐

Question

这是一个非常简单的问题，但经过几个小时的网上冲浪，我意识到可能我没有得到这个概念。

我有：

<style>
 #more{width:190px; height:44px; border:1px solid #CCCCCC; padding-bottom:3px;vertical-align:middle;}
</style>

 <div id='more'> My text </div>

这不会垂直居中“我的文字”。如何将文本垂直居中？

万分感谢

Answer 1

您需要使用display: table-cell;才能使文本垂直居中。

Jsfiddle演示。

Answer 2

我会使用line-height等于div的高度。

line-height: 44px;

NB：这只适用于一行中的文字。