div内的文本会改变它的位置

Question

正如你在这个小提琴中看到的那样：http://jsfiddle.net/BDVPP/我的大矩形位于它应该位于的位置之下。如果你删除里面的文字，一切都很好。文本与div的位置有什么关系？我该如何解决这个问题？

<div class="cont">
<div class="doubleTile">THIS TEXT MESSES UP EVERYTHING //remove this text to achieve the desired position
</div>
<div class="tile">
</div>
</div>

Answer 1

试试这个：http://jsfiddle.net/BDVPP/8/

• 使用display: block代替inline-block;
• 使用float: left将元素放在一起，无论其内容如何。

Answer 2

主要的共鸣是因为一个盒子里面有内容而另一个盒子没有

只需在空div中添加一个 ，你没理由改变浮动。

以下是Js Fiddle