css - 具有等间距 DIV 的流体宽度(也来自容器)

Question

我想实现这个，只使用 HTML/CSS:

很像this或 this , 除了它们与容器的距离也必须相等。

Answer 1

如果您需要间隔的元素具有已定义的宽度并且您不需要 IE8 支持，您可以使用 calc() 来执行此操作 (http://caniuse.com/#search=calc)。

只需在子元素中添加如下margin-left即可。

/* X = number of containers */
/* Y = container width (needs to be defined) */
/* Z = number of spaces (usually X + 1) */
margin-left: calc((100% - (X * Y)) / Z);

代码笔:http://codepen.io/supah_frank/pen/OPMrvZ