css - 如何使用 div 将元素定位在同一级别，以便页面不会分崩离析？

Question

我使用 div 并排放置了 3 个元素。问题是其中之一会根据用户输入动态增长。如果它变得太大，所有元素都会落入错误的位置，整个页面都会被毁容。如何在不使用表格的情况下解决此问题。

Answer 1

您可以使用 width CSS属性。并排 float 元素，然后每个元素的内容将具有您将为每个元素设置的 width。

html

<div class="box" id="first">content</div>
<div class="box" id="second">content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content </div>
<div class="box" id="third">content content content content content content content content content content content content content content content content content content </div>

CSS

.box {float:left; width:200px;}
#first {background:red;}
#second {background:blue;}
#third {background:green;}

演示: http://jsfiddle.net/K9K6B/