CSS清除每个第3个元素

Question

我觉得像CSS meme中的peter griffin，搞乱CSS。有人可以解释我如何获得3行以及为什么下面的代码不起作用？

这是一个jsfiddle example来提供更多背景

self.itemSelectedHandler();

Answer 1

你是浮动内联块，这是内联的，所以清除浮动将无能为力！将display:inline-block更改为display:block。此外，您的容器上有display:flex，删除它并且您很好：https://jsfiddle.net/6w8a8qmt/1/

Answer 2

.mdl-grid中有一个类#container，它将#container定义为flexbox容器。这使得它的子项为flex-items（即浮动被停用）

用

覆盖它

#container.mdl-grid {
  display: block;
}

并将最后一个选择器更改为

#container a:nth-child(3n + 1) { ... }

这是改变的小提琴（我知道，白色背景不合适，但你必须自己解决这个问题......）

https://jsfiddle.net/eqy1f8k4/2/