:nth-child 和无限滚动

Question

在site I'm creating 上，我们有一个项目网格，所有行都可以正常浮动，因为 CSS 的这个小 sn-p：

.collection .grid-item:nth-child(3n+1){ clear: left; }

这使得每行中的第一项成为clear:left，这允许新行从最高行的高度结束处开始。

这很好用。

但是，当我尝试添加无限滚动时，它会破坏网格。无限滚动是在网格中添加两个项目display:none 项目、分页和加载栏。

由于某种原因，clear:left 的 css 正在识别这两个元素，并在加载到网格的每个页面上在网格中创建两个间隙。

关于如何解决这个问题的任何想法？

Answer 1

:nth-child 将平等对待.grid-item 的每个子元素，因此您的分页和加载栏符合条件。尝试将寻呼机和加载程序移到 .grid-item 之外。