html - 如何使块成对并排排列？

Question

我有几个包含内容的简单 div，它们的宽度为 50%，并且向左浮动。这意味着它们都并排排列（成对）。但是，如果其中一个块的内容少于另一个块，则下面的块会浮动在错误的一侧=中断。

有没有一种简单/干净的方法来处理这个问题，不涉及在每隔一个 div 之后添加 clearfix div？这是现在的css代码：

div {width:50%; background:#ccc; float:left; margin-bottom:20px;}

http://jsfiddle.net/yWxBe/

Answer 1

你可以做：

div:nth-child(odd){
  clear: left;
}

这是您更新的演示：http: //jsfiddle.net/yWxBe/1/

Answer 2

您可以为左右列制作容器 div 吗？

替代方案：jQuery，有大量的 jQuery 库来解决这个问题。