仅CSS带div的多列

我目前正在开发一种服务器接口。用户应该能够根据自己的意愿拖放项目以对齐界面。最简单的方法（我也希望它能起作用）是，像在Windows8的“开始”菜单中，拖动块，其余的块自动对齐

我找到了相应的css属性，

（-preamble-）column count

。这类作品，但仅限于文本。我的小部件是

-容器

下面是我的问题：

是否有可能只允许3行n列

如何使列宽保持不变（当前，它随视口大小调整大小，即使使用

-webkit列大小
[Chrome 28]）。这将在一行中显示例如3个项目
如何防止立柱之间出现巨大间隙<代码>-webkit列间距
不会真正改变间距，它只会将其设置为最小值。设置父容器的宽度并不是一个真正的选项，因为我真的想让它非常动态
下面是一个例子，说明我想得到但不起作用的东西：

Before drag: 
1 | 2 | 7 | 8
3 | 4 | 9 | 10
5 | 6 | 11| 12

After dragging "5" behind "7"
1 | 2 | 5 | 8
3 | 4 | 9 | 10
6 | 7 | 11| 12

为了确保：
我没有提到拖动部分，因为我已经有了解决这个问题的方法。我目前的问题只是表格的对齐

为了给您提供一些示例，我创建了一个JSFIDLE：
好的，我刚想好，我可以设置
height
属性来定义行数，所以只要忽略#1:）如果您阅读spec列大小按预期工作：。好的，我明白了。现在它工作得更好了，但是列间距仍然是一个问题，但是我想，如果不定义固定的宽度，我将无法修复它。您之所以使用多列模块，是因为您希望项目从上到下、从左到右填充吗？您的示例布局没有演示这一点（它显示从左到右，从上到下）。我认为，两者（这里的代码和我的小提琴）都显示了两者（如果我错了，请纠正我）。我想有两列，这两列从左到右，但我想，我没有明白，你想说什么。我在两个来源中显示的方式是我希望它的行为方式。