布局和浮动div问题

Question

所以，我的布局看起来像

正如你在那里看到的那样，div完全浮动/对齐到右侧，但是在左侧之间有一个间隙，我该如何清除间隙？

DIV CSS：

.thread-list{
   width: 40%;
   background-color: #fff;
   padding: 10px;
   border-style:solid;
   border-width:1px;
   border-color:#F0F0F0;
   margin-bottom: 3px;
   margin-right: 10px;
   margin-bottom: 10px;
   overflow: auto;
   float: left;
}

注意：div正在动态显示内容（来自数据库），我无法将div分成两列。

对不起，如果我不够清楚的话。

Answer 1

<强> DEMO

如果你浮动多个元素＆amp;其中一个div的高度比其他高，然后创建这些类型的效果（你在屏幕截图中显示的那个）。

解决方案1：使用:nth-child(2n+1)在每个行的第一个元素左侧清除浮点数..2n..因为您在一行中有2个元素。

在样式表中添加此css：

.thread-list:nth-child(2n+1){
    clear:left;
}

解决方案2：解决方案1会对齐所有div，但下方仍然会有负空间，如果您不想要，那么您必须使用 {之类的插件{3}} ，使用纯css无法实现此效果。