css - 阻止 CSS float 溢出

Question

我在 Dabblet 中有一个代码:http://dabblet.com/gist/5705036

即使在不使用绝对定位的情况下调整浏览器的大小，我也想让这些段保持在它们的位置。例如，当浏览器调整大小时，主内容容器换行 [我在我的大多数容器中使用 CSS Floats]。

我的代码有问题吗？

float 是否适合布局？或者我需要使用其他任何东西？..

我自己无法修复它，并且通过大量研究，仍然没有一个好主意来使用它来解决这个问题。 [此外，我使用 HTML5 标签，例如:section、article、nav 等。]

Answer 1

只需从 maincontent id 中删除 float:left; 并应用 display:table-cell; .您的问题将得到解决。

这是代码。

#maincontent {
    border: 1px solid #BBBBBB;
    border-radius: 5px 5px 5px 5px;
    display: table-cell;
    margin-top: 15px;
    min-height: 400px;
    padding: 2px 6px;
    width: 700px;
}

希望这对您有所帮助。