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

在 .menuItems 中使用 line-height，具有相同的高度值，例如：

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

Answer 3

试试这个 ：

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;
}