css - 列に div を表示する方法 - 流体設計

Question

 <div id="foo">
    <div class="bar">
       there are very many divs like this  
    </div>
 </div>

CSS

#foo{
    margin: 10px auto;
    min-height: 400px;
    min-width: 800px;
}
.bar{
    float: left;
    text-align: left;
    width: 450px;
    min-height: 280px;
}

div #foo は、含まれるメディアの 800px から 100% までの可変幅を持つことができ、div .bar は可変高さを持つことができます。幅の広いディスプレイでは、3 列の .bar div が必要ですが、高さが可変であるため、上の div の左側にスライドするように見えるため、左側の div の上にはスペースがあります。それらを上向きに浮かせるにはどうすればよいですか。私は理にかなっていると思います。