浮动的Divs彼此重叠

Question

我在屏幕上工作，我试图做出一些反应。我的意思是，如果屏幕尺寸发生变化，div应移动到下一行。

它有点像这样：

＆＃13;

＆＃13;

.contributor_thumbnail {

    display: block;
    float: left;
    width: 250px;
    height: 150px;
    border: 1px solid #777;

}

＆＃13;

 <div class="contributor_thumbnail">thumb here</div>
   <div class="contributor_thumbnail">thumb here</div>
   <div class="contributor_thumbnail" style="height:2px; width:48px;">thumb here</div>
   <div class="contributor_thumbnail">thumb here</div>

＆＃13;

＆＃13;

＆＃13;

有4个div并排。其中一个比其他一个小一点。 根据屏幕的大小，最后一个div将自己放在第二个div上。您可能需要检查div并更改contributor_thumbnail的宽度，直到获得此结果（如附图所示）

反正有没有浮动div没有堆叠在一起。我知道我可以设置display：inline-block;对所有人来说，这不是我的选择。