Webkit忽略包含行框的内联块的垂直对齐

Question

当Webkit（Safari，Chrome）遇到内联块时......

1. 指定line-height高度
2. 使用多个线框呈现内容

... inline-block元素忽略指定的vertical-align。

为了帮助说明问题，我有一个小测试用例： http://arther.net/lab/webkit-vertical-align-test.html#test

---

Firefox 3.6，Opera 10.53和IE7 +将这些内联块视为内联元素，垂直对齐按预期工作。 Webkit浏览器（和Opera 10.10）在这种情况下将内联块视为块级元素，因此忽略vertical-align。那么，谁是对的，谁是错误的？

我可以看到这种情况。一方面，您可以说所有内联元素 - 甚至是内联块 - 都应该按照vertical-align在包含的行框中正确定位。另一方面，内联元素通常定义一个内联框，并且没有自己的行框。包装多个行框的任何内容都应该是一个块级元素。在这种情况下，内联块应该被视为一个块，因此会忽略vertical-align。

鉴于目前的行为，我认为以下之一是正确的：

• 这是一个Webkit bug
• 这是所有其他渲染引擎中的错误
• 关于处理这种特殊情况的规范含糊不清，正在采取不同的方法

如果有人能对这个问题做出一些澄清以及预期的行为应该是什么，我将不胜感激。

Answer 1

这看起来像一个错误，因为当该部分只占用一行时它可以工作。

Chrome和Safari具有报告错误的功能，可以帮助开发人员修复错误。