html - 在 HTML 中管理容器的垂直溢出

Question

我有一个这样的 HTML 结构：

<div style="max-height: 520px;">
  <div style="height: 250px;">
    [...]
  </div>
  <div style="height: 250px;">
    [...]
  </div>
    [...]
</div>

我希望我的 div 表现得像在 GridView 中一样，如果达到主 div 的最大高度，则进入一个新列，就像在第二种情况下一样（对于糟糕的 MS Paint 绘图感到抱歉）：

蓝色框是主要的 div，黑色的是次要的。我能做些什么？

Answer 1

这是你的意思吗：http: //jsfiddle.net/m8LgG/

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

.container {
    max-height: 520px;
}

.container div {
height: 250px;
width: 250px;
border: 1px solid #33d;
border-radius: 10px;
float:left;
margin: 0 10px 10px;
}

顺便说一句，最好不要有内联样式。尝试并在语义上构建您的代码:-)