为什么内联块元素未对齐？

Question

在div vertical-align: top;内，我有两个元素：img和span（内部有aaa）。

这两个元素都设置了display: inline-block;和width以及height。

无论我做什么和尝试什么，元素都是 MISALIGNED ，如下图所示。 有什么问题，我该如何解决这个问题？

每个浏览器都会出现此问题 - FF，IE，Safari ... http://jsfiddle.net/CaU59/

Answer 1

您需要将vertical-align添加到元素本身，而不是其容器。它们目前已对齐baseline，您可以从与图像排列的文字中看到。

http://jsfiddle.net/CaU59/2/

Answer 2

vertical-align: top将添加到每个元素

DEMO http://jsfiddle.net/CaU59/1/