向下推第二行以便向左浮動的div

Question

我有2行，所有div都向左浮動，但我希望第二行和所有未來行都放在前一行之後，而不是碰到它。在第一個描述很長時，請注意第二個描述如何運行到第一個。

這裏是我的小提琴： http://jsfiddle.net/wyc112y8/

CSS

.dataleft { 
float:left; 
} 
.pushdown { 
    margin-bottom:40px; 
} 
.thedatadescr { 
margin-top:8px;text-transform:Capitalize;font-size:13px;width:300px; 
} 

.thedata { 
margin-top:8px;text-transform:Capitalize;width:300px; 
} 
.thedatahalf { 
margin-top:8px;text-transform:Capitalize;width:145px;text-align:left; 
} 

HTML

<div id="wraprow1" class="pushdown"> 
<div id="data-date" class="dataleft thedatadescr fontr" style="">long descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong descriptionlong description</div> 
<div id="data-company" class="dataleft thedatahalf fontr" style="margin-left:5px;">$12</div> 
<div id="data-company" class="dataleft thedatahalf fontr" style="margin-left:9px;">100</div> 
</div> 


<div id="wraprow2" class="pushdown"> 
<div id="data-date" class=" thedatadescr fontr" style="">Second description</div> 
<div id="data-company" class="dataleft thedatahalf fontr" style="margin-left:5px;">$12</div> 
<div id="data-company" class="dataleft thedatahalf fontr" style="margin-left:9px;">100</div> 
</div> 

Answer 1

你必須使用這樣的事情在你的CSS。

.pushdown { 
    display: inline-block; 
    margin-bottom: 40px; 
}