垂直对齐应该适用于孩子？

Question

此属性是否也会影响应用它的元素的子元素？

Here is my example

span{
 vertical-align:top;
 font-size:27px;
 border-bottom: 1px solid red;
}
a{
  border-bottom: 1px solid green;
}

<span>
  <a>Hi ho hoh ho</a>
  Hi ho hoh ho
  <a>Hi ho hoh ho</a>
</span>

在Firefox上，该属性不会影响子项，但在Chrome上，子项未对齐。

Chrome：

Firefox：

什么是良好的实施？

Answer 1

检查这个小提琴：

http://jsfiddle.net/5XMk8/7/

在“a”标记中添加所有文字并提供float:left并将其设为display:block

Answer 2

根据规范，vertical-align不会被继承，但它可能会影响内部元素的基线级别。然而，浏览器有很长的古怪历史和不同的属性实现。

使用您的确切代码进行测试，我在Chrome（22beta）上看到的与Firefox相同，所以也许您在某些旧版本中遇到了奇怪的问题。

要查看浏览器之间的明显差异，请使用不同的字体大小。结果将难以解释。无论如何，士气是我们应该避免在大多数情况下使用vertical-align。使用相对定位往往会产生更一致的结果。