CSS网格-如果包装，则将它们平均划分为行

Question

我正在学习CSS网格。

我进行了以下设置：

grid-template-columns: repeat(auto-fit, minmax(45px, 1fr));

因此，如果子代小于45像素，请换行。

我想知道是否有可能将其包裹起来，以便将子项平均分配到形成的“行”中。

例如，给定12个孩子，则是12行的1行，6行的6行，4行的4行，等等。

Answer 1

尝试一下：

.parent-class { 
    display:grid; 
    grid-template-columns:repeat(4, 1fr); /* repeat 4 columns per row */
    grid-template-columns:repeat(6, 1fr); /* repeat 6 columns per row */
    column-gap:15px;
}