如何中间漂浮，多行divs在100％宽度包装器内

Question

我有不同宽度的图块列表。他们所有人都以自动宽度坐在.projects内，并且由另一个Div（.wrapper）包裹，该div具有100％的宽度。

<div class="wrapper">
    <div class="projects">
        <div class="pro p1"></div>
        <div class="pro p2"></div>
        <div class="pro p4"></div>
        <div class="pro p2"></div>
    </div>
</div>

我想以.projects块为中心，但是.pro应该向左漂浮，因为我想保持瓷砖向左对齐，所以我不能将display: inline-block;用于.pro元素。

如果元素数量可以适合一行 -> .projects宽度等于所有.pro容器的宽度总和（小提琴中的第一个和第二个示例）。

但是，如果元素数量较大，则将其转到另一行，.projects容器成为100％宽度，而不是内部元素的实际最大宽度。

如果子元素不适合一行而不是在上一个示例中效果？

是否可以实现.projects的宽度，而不是100％？

看代码：http：//jsfiddle.net/68U47/2/

Answer 1

.projects { 宽度：600px; 保证金：0自动；}[class^=" pro"] { 显示：内联块； 宽度：20％； 向左飘浮;}

类似的事情应该这样做，基本上项目的余量0自动将其集中在屏幕上。