为什么这个CSS会播放？

Question

我有一个非常基本的容器，里面有几个孩子divs，显示为inline-block。一切正常，直到我实际将内容插入子div。当我有内容时，他们似乎没有明显的原因向下移动。

Here是一切运作良好的小提琴。

而here就是把它弄得乱七八糟（含有内容）。

有人可以告诉我为什么会这样，以及如何解决？

我已经好几个小时了，但似乎无法弄明白。非常感谢任何帮助。

Answer 1

而不是使用display: inline-block使用display: block; float: left;

http://jsfiddle.net/GtPWX/2/

或者你可以在方框上设置vertical-align: top。

Answer 2

将vertical-align:top添加到框中。