0

我目前正在研究一种服务器接口。用户应该能够根据自己的意愿拖放其项目以对齐界面。最简单的方法（也是我希望它工作的方法）就像在 Windows 8 开始菜单中一样，您可以在其中拖动块，其余部分自行对齐。

我找到了相应的 css 属性，(-preamble-)column-count. 这种作品，但仅适用于文本。我的小部件是<div>-容器。

所以这是我的问题：

  1. 是否有可能只允许 3 行和 n 列？
  2. 如何使列宽保持大小（目前，即使使用-webkit-column-size[Chrome 28]，它也会根据视口大小调整大小）。这将在一行中显示例如 3 个项目。
  3. 如何防止列之间的巨大间隙？-webkit-column-gap不会真正改变差距，它只会设置最小值。设置父容器的宽度并不是一个真正的选择，因为我真的想让它变得非常动态。

所以，这是我想要得到的一个例子，但不会工作：

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

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

举个例子，我创建了一个 jsfiddle：http: //jsfiddle.net/mine/WmkPR/

4

0 回答 0