我正在尝试使用 @support 使用新的 CSS 网格布局 来设置定义列表的样式，以绕过旧版浏览器。 Autoprefixer 将其更改为 Edge 的旧版本。
dl {
display: grid;
grid-gap: 0.5rem 0.75rem;
grid-template-columns: min-content 1fr;
display: -ms-grid;
-ms-grid-gap: 0.5rem 0.75rem;
-ms-grid-columns: min-content 1fr;
}
/* visual styles */
dl {
font-family: sans-serif;
padding: 0.75rem;
}
dt {
font-weight: 700;
text-align: right;
white-space: nowrap;
}
dd {
margin: 0;
}<dl>
<dt>Lorem</dt>
<dd>Ipsum</dd>
<dt>Lorem</dt>
<dd>Ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata
sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</dd>
<dt>Longer Lorem</dt>
<dd>Ipsum</dd>
</dl>看上面的代码，Edge折叠了整个内容，导致不可读。添加grid-column-start和grid-column-end推<dt>和<dd>进入右列。
全部<dt> s 应与 min-content 具有相同的宽度最大的一个。
有没有办法在不知道<dl>的子级的最终数量的情况下将内容推送到正确的行中？
最佳答案
Microsoft Edge 支持已过时版本的 CSS 网格布局规范。
Edge 正在实现当前规范。
有关 Edge 对 Grid 的支持的详细信息，包括哪些有效、哪些无效以及实现状态，请参阅此页面:
https://developer.microsoft.com/en-us/microsoft-edge/platform/status/grid/?q=grid%20update
关于CSS 网格布局 - Microsoft Edge 上的内容折叠，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44329182/