根据上下文，display: contents可能是display: subgrid的可行解决方案。
来自caniuse：（粗体矿）
display: contents使元素的子元素看起来好像是元素的父元素的直接子元素，忽略元素本身。当使用CSS grid或类似布局技术时应忽略 Package 器元素时，此功能非常有用。
最大的好处是，我们可以保留当前的标记--将每行数据分组在一起--同时保持每行的组件同步在一起，因为它们只是一个CSS网格的一部分--网格容器。
关于浏览器支持：display: contents受Chrome、Firefox和iOS 11.4+支持。
所以回到OP的示例Codepen，我们可以使用display: contents来实现所需的结果：
1)将网格容器属性移动到globalWrapper div并

#globalWrapper {
  display: grid;
  grid-template-columns: 1fr 1fr max-content;
  grid-gap: 3px;
}

2)使用display: contents设置rowWrapper div

.rowWrapper {
  display: contents;
}

Updated Codepen demo

使用display:contents来模拟css子网格是一个技巧：黑客行为增加了复杂性--使代码更难维护并容易出现其他错误--迟早他们会停止工作。
注意使用display:contents作为子网格的替代：there are good reasons why it should be avoided。在容器元素中使用另一个Grid或Flex。

**[Adendum 11/1/2020]**Firefox从V71开始支持Subgrid，其他浏览器尚未发布消息。有一个good explanations about the feature in codrops，你可以see some examples here。这是一个链接，可以看到当前所有浏览器的支持，我可以使用
[Adendum 06/06/2022]Apple announces subgrid support for Safari 16
[Adundum 05/25/2023]display: contents considered harmful