中心固定宽度的CSS3容器中的多列

Question

我使用CSS3多列，列宽设置为200px，留下列数可以适应不同的屏幕大小。

这里是我工作的代码：http://jsfiddle.net/kBPUX/

在我1280px宽的笔记本电脑，作为窗口将展开一至两一路攀升到四列的列居中。它的效果很好，但当窗户最大化时突然出现在四列，所有突然出现的列都证明在右侧留下了一个很大的丑陋水沟。

任何想法是什么，以及如何使列以任何分辨率为中心？

编辑：在玩了一些之后，我相信发生了什么是浏览器不想再做任何列。列填充未指定，因此它默认为自动并尝试尽可能匹配列高度。添加更多列会导致高度不同的列。正是在这一点上，我想确保列在父容器中居中，而不是左对齐。

备注：这适用于我在Firefox，Chrome和IE9这是我所支持的一切。我绝对不会碰JQuery布局产品;它必须是纯粹的CSS。

Answer 1

为什么不使用column-count？

http://jsfiddle.net/Svyy2/4/

也看一下div的width。如果您将它们设置为与columns相同的width，则会出现问题，因为width+padding+border>column width。例如，将其设置为90％。

Answer 2

截至今天，我不知道任何工作解决我的问题，但我相信正确的解决方案是多列规范的列空间分布属性，但它不是由任何浏览器呢。