为什么内联块元素会出现对齐问题？

Question

在一个具有“vertical-align: top;”属性的

中，我有两个元素，一个是和一个包含aaa的。

这两个元素都具有"display: inline-block;"、"width"和"height"设置。

无论我做什么和尝试什么，这些元素都会像下面的图片所示错位。

问题出在哪里，我该如何解决？

这个问题在每个浏览器中都会出现 - FF、IE、Safari... http://jsfiddle.net/CaU59/

- Dusan

---

为什么不将其放入jsfiddle.net？ - Ed Heal

你能发布一份JSFiddle吗？ - Poornima

Answer 1

您需要将vertical-align添加到元素本身，而不是其容器。如您所见，它们当前与图像基线对齐，因此文本会排成一行。

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

- James Montagne

---

是的，那就是问题所在！ - Dusan

Answer 2

需要将vertical-align: top添加到每个元素上。

DEMO

- Kevin Lynch

---

这个东西让我疯了，现在解决了。 - synkro