php - float div，像行一样对待

Question

我有这样的东西:

<div id="container">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>

我已经将容器设置为一个明确的修复并将 div float 在容器内，如下所示:

但是，当我在一个 div 中有其他文本时，我喜欢将其他 div 向下推，就像它们是一行一样，如下所示:

相反，由于有花车，我得到了更像这样的东西:

我只是想知道解决此问题的最佳方法。我可以在每个“行”周围放置一个包装器，例如:

<div id="container">
    <div class="row">
    <div></div>
    <div></div>
    <div></div>
    </div>
    <div class="row">
    <div></div>
    <div></div>
    <div></div>
    </div>
    div class="row">
    <div></div>
    <div></div>
    <div></div>
    </div>
</div>

但这似乎是很多额外的非语义 div...另外，如果我动态生成 div(通过 cms 中的 ListView )，那么我必须添加额外的代码来计算三个的每个倍数分区...

Answer 1

哦哦哦!地铁瓷砖:)

这可能是一篇旧的(3 年前的)帖子，但仍然很好地解释了如何跨浏览器一致地设置 float 高度。

http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/