css - span 元素的垂直对齐方式

Question

我在垂直对齐方面遇到了一些问题。我想把我的 <span>›</span>垂直集中的元素。 http://jsfiddle.net/vpVEf/

有没有办法自动将其集中为本例中的“li a”？请注意，a 元素是集中的，没有使用 line-height。 http://jsfiddle.net/vpVEf/9/

Answer 1

发生这种情况的原因是因为 a 标签有一个填充，将其中的所有内容向下推 12px。

移除顶部/底部填充并使用 line-height 使其达到 68px 高度。

padding: 0 12px;
line-height: 68px;

它可能看起来不像，但这确实解决了问题。从 span 中删除所有格式以查看!但现在的问题是文本没有在跨度内居中对齐。您也可以在 span 上使用 line-height 来调整它。

line-height: 55px;

看起来效果不错。

DEMO