jquery - 当在其上调用 jquery html() 时，内联 block div 向下移动

Question

请看一下这个 jsfiddle:http://jsfiddle.net/NtxG9/1/

我有两个 div，具有相同的类，它们显示为内联 block 。 如果我调用 $('#parent1').html('some text'); 然后它会向下移动。

有人能解释一下为什么会这样吗？

谢谢!

编辑

感谢所有这些解决方案，但我仍然不清楚为什么会这样。 为什么更改 div 的内容会影响它的位置？

Answer 1

解释:

您可以用来显示内联 block ，这意味着默认情况下 inline-block 是 baseline 而不是定义为始终 vertical-align top 如果您在任何 html 元素中定义 display:inline-block 元素。

尝试使用

.parent {
    vertical-align:top;
}

Demo