CSS文本居中於DIV內部

Question

我正在努力實現某些目標而無法實現這一目標。

我有一個固定高度和寬度的div。 我希望文本垂直居中。

到目前為止我設法做到了：

<div>
   <a>this is a long text</a>
</div>

它看起來像這樣

-------------
This is a long
    text
-------------

這很棒

但是如果線條不會換行，它將會是這樣的

------------
This is short

-------------

.the-div
{
height:29px;
line-height:14px !important;
}

.the-a
{
font-size:12px;
}

我需要這個也是值得的！

我嘗試使用行高並與JS一起玩，以了解它是否包裝，然后相應地改變行高

謝謝您的幫助

Answer 1

試試這個例子

http://jsfiddle.net/fcalderan/3HBC4/1/

Answer 2

要進行垂直對齊，您還需要使用一些顯示作為表格黑客。 這將允許你使用vertical-align:middle; ，實現我相信你渴望的外觀。

例

Answer 3

.the-a
{
font-size:12px;
vertical-align: middle;
}

Answer 4

如果你使行高與div的高度相同，它將自動垂直居中

the-div
{
height:29px;
line-height:29px !important;
}

Answer 5

div a{
margin-top:auto;
margin-bottom:auto;
}