如何浮动不同高度的div？

Question

我想要实现的目标:

我目前得到的:(第二个框有一个额外的列表项,弄乱了整个布局)

HTML:

<div id="categories">
    <div class="cat">   cat1    </div>
    <div class="cat">   cat2    </div>
    <div class="cat">   cat3    </div>
    <div class="cat"> cat4 </div>
    <div class="cat">   cat5    </div>
    <div class="cat">   cat6    </div>
    <div class="cat">   cat7    </div>
    <div class="cat">   cat8    </div>
    <div class="cat"> cat9 </div>
    <div class="cat">   cat10   </div>
</div>

一种解决方案是将新项目中的五个项目分组并应用,clear:left但由于php代码的工作方式,我无法做到这一点.

Answer 1

我做了很多,并不断回到这个参考:

http://css-tricks.com/snippets/css/cross-browser-inline-block/

我认为这将帮助您实现您所追求的目标.