检测 css-grid 自动流密集布局中的孔并调整然后调整元素大小

Question

使用 css-grid，自动流密集可以通过乱序插入元素来调整元素的布局以创建密度。在某些情况下会有间隙，因为没有合适大小的元素适合空间。我的问题是我是否可以在布局后检测到这种情况，如果可以，如何检测？使用 JavaScript 或其他任何东西都可以。

编辑：我的目标是通过某种方式创建一个完全填充的网格 - 最好是调整网格组件元素的大小。我更喜欢没有可变大小列 和 行的网格。用例是一份报纸，它可以根据每篇文章的一些抽象权重来布局首页，以反映其重要性或受欢迎程度。需要明确的是，网格元素不需要包含所有内容。

Answer 1

我认为您要问的是如何识别未占用的网格单元。

我不认为这是可能的，因为没有一个网格区域占据空间，一个未被占用的单元格只是一个抽象容器，专为布局算法使用而设计。

但这是我目前最好的猜测。

以下是网格规范中的两个关键部分，供任何想要研究的人参考：

• 7.7. Automatic Placement: the grid-auto-flow property
• 8.5. Grid Item Placement Algorithm