CSS：在另一个浮动列下浮动一列

Question

我正在尝试对网站进行一些维护，我注意到有一页有点不合适。它们是左侧列的容器div，右侧是内容的容器div，另一个是整个页面内容的容器。在页面的底部，但在页脚之前，一行中有三列，它们落入主容器中，所有列都在单独的div中（相同的div类），所有都是浮动的。

除了一个页面外，每个页面都可以正常工作。右侧的内容不足以将三列向下推到左侧的大列下方。所以你得到的是连续两列浮在左边的大柱上，而不是靠在容器上，第三列漂浮在第二列之下。

三个较小列的CSS是：

.FBG .blok {
    width:270px;
    float:left;
    padding:5px 20px;
    margin:0;
}

每个页面上的代码都相同，但就像我说的那样，这个页面的不同之处在于右侧div中没有​​足够的内容来推动列。

有没有办法在这个问题上明智地编码？或者我需要在此页面中添加另一个嵌套div吗？谢谢你的回复！

Answer 1

我刚想通了！我所要做的就是做一个清除浮子的div类。这就是我在课堂上的内容：

.clr {
    clear:both;
    padding:0;
    margin:0;
}

我把它放在容器类中的div之后，但就在单个列div之前。工作就像一个魅力！