自动填充两列

尝试以下文章 AListApart 几乎覆盖了所有的基地

我终于下定决心,用两个浮动的沙发床来实现这个布局。

如果服务器端代码超过了中间点(当前索引=长度的一半),它将迭代这些项并创建一个新的DIV。

生成的HTML如下所示:

<div class="container">
  <div class="column">
    <div>Item 1</div>
    <div>Item 2</div>
    <div>Item 3</div>
  </div>
  <div class="column">
    <div>Item 4</div>
    <div>Item 5</div>
  </div>
  <div style="clear: both"></div>
</div>

CSS:

.column { float: left; }

服务器端将决定何时关闭并创建一个新的分区。不是很漂亮,但它可以工作。