span和anchor默认高度

Question

你能告诉我为什么<a>有一个不同的span元素高度吗？

为什么<a>垂直居中对齐，而span占据所有垂直可用空间？

http://jsfiddle.net/vpVEf/12/

Answer 1

这是因为你的list-item行高是70px。跨度高度基于行高。

#MenuEventos li {
line-height: 70px;
}

Answer 2

您的代码存在一些问题。首先，font-size:3em为span，a为float:right。另外，您float:left跨度a span因此li的内容到达父font-size:3em的右上方。

解决方案：为li添加span并将其从float:left中删除。为a添加float。要为overflow:hidden清除li添加outline。但由于您使用outline，黑线将不可见。因此，将border:3px solid #000更改为{{1}}

演示： http://jsfiddle.net/vpVEf/13/