css - 动态 HTML DIV，大于 float : left;

Question

这个问题不太可能帮助任何 future 的访客；它仅与一个小地理区域、一个特定时刻或一个非常狭窄的情况相关，而这些情况通常不适用于互联网的全局受众。如需帮助使这个问题更广泛地适用，visit the help center .




9年前关闭。




我有一些大小不同的 DIV 元素，当页面填充(从左到右)时，我希望 DIV 元素在下一行垂直和水平地折叠起来。

描述不好，但我有一个演示页面，如果你能提供帮助，你可以看看:)
http://www.techonline.co.nz/modules/navigator/navto.php?unique_ID=16

上下 DIV 之间的大间隙看起来很糟糕，尤其是如果您在右侧展开 DIV。我想让它看起来整洁紧凑。

我从来没有很好的设计，所以任何帮助将不胜感激。

Answer 1

在内容所在的位置创建 2 个 div。一个向左浮动，另一个向右浮动。在这些 div 中，您放置内容框。所以在你的情况下。

CSS:

 #left {float: left;}
 #right {float: right;}

和你的html:

<div id="left">
     <div class="divby2">Title 1 and rest of content</div>
     <div class="divby2">Title 3 and rest of content</div>
</div>

<div id="right">
     <div class="divby2">Title 2 and rest of content</div>
</div>

这样，您的标题 3 div 不会查看 div 2 的位置，但它会查看 div 1。例如，我是如何做到的，请查看 here