css - CSS を使用してテキストを中央に垂直に揃えるにはどうすればよいですか?

Question

ここに フィドルリンクがあります

liさて、ここでテキストを垂直方向に揃えて、要素の真ん中に来るようにします。少し塗ればできるのですpaadding-topが、そうすると上の部分がliリンクとして残りません。を使用するdisplay:table-cellと、すべての要素が水平方向に整列しますli(これは望ましくありません)。それで、解決策は何ですか？

Answer 1

これがワーキングソリューションです。

コード：

.menuItems a {
    display: table-cell;
    height: inherit;
    vertical-align: middle;
    width: inherit;}

Answer 2

これを試して ：

http://jsfiddle.net/ssF5K/3/

CSS :

.menuItems{
position: relative;
border-top: 1px solid #CCC;
vertical-align: middle;
height: 40px;
width: 85%;
padding: 0;
font-family: Geneva, 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
font-size: 1.2em;
font-weight: 500;
text-align: center;
    line-height:40px;
}

Answer 3

同じ高さの値で、.menuItems で line-height を使用します。例:

height: 40px;
line-height: 40px;