使用基于百分比的列系统 - 处理小数？

Question

我正在尝试为我的网站创建一个响应式列系统。从本质上讲，在网格图像的块，这将类似于此到底：

当黑线表示容器，而且颜色表示图像的分类。

问题是，这种布局将需要一个带0沟的6列网格。使用百分比时，每列需要重复16.66％，这很难保持准确。处理创建类似问题的最佳方法是什么？我知道的唯一方法是使用CSS将宽度设置为百分比，但正如我所说的那样，使用小数位和所有数字难以保持精确。

Answer 1

如果我正在用静态HTML生成完全的布局，我会有宽度为16.6％的倍数的类，并且为每行填充最右边的div以构成100％（例如5x16.6％和1x17 ％）。听起来很混乱，但你可以很干净地使用诸如“two-col right”等类的属性。

个人而言，我的OCD会迫使我重新考虑列数或添加阴沟以使所有事物干净地合起来。另外，如果你很乐意提供依赖于javascript的页面，这是一个奇妙的（已经响应的）jQuery插件，用于这种类型的布局http://isotope.metafizzy.co/v1/index.html。