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

Question

正如您在这个 fiddle 中看到的: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 将元素并排放置，而不考虑它们的内容。