我非常喜欢 CSS Grid，并且如今几乎在每个项目中都使用它。但是，其中有一部分使事情变得比实际情况复杂得多：缺乏子网格。在这篇关于此事的文章中，Ken Bellows 解释了为什么它们如此有用
但 Level 1 规范中仍然缺少的一件事是创建子网格的能力，子网格是一个具有自身网格的网格项，它在一个或两个维度上与父网格对齐。最初计划将其包含在 Level 1 中，但工作组决定他们需要更多时间来制定细节，因此将其删除，它将在 CSS 网格布局模块 Level 2 中发布，该模块似乎即将完成。
在过去两年中，关于子网格的使用案例、如何实现以及是否需要它进行了大量的讨论。许多讨论都集中在可以处理与子网格相同问题的其他两种方法上：嵌套网格和 display: contents
我记得我参与的第一个网站之一非常类似于 Ken 用作示例的演示，但这要追溯到 2012 年，当时网格还不存在。遗憾的是，我不得不编写比我认为必要的多得多的 CSS 才能使一个 div 中的元素与另一个 div 中的元素对齐。无论如何，本文有点借鉴了 Rachel Andrew 关于 子网格及其可以解决的问题 的文章，这篇文章也绝对值得一读。