edge 16–18 不解析 gap 属性，需改用显式声明的 grid-row-gap 和 grid-column-gap；edge 12–15 完全不支持 display: grid，须用外层 fallback + @supports 内层 grid；autoprefixer 对 edge grid 无效；subgrid 全系不支持，需手动降级。
Edge 16–18 的 gap 属性直接被丢弃，不是不生效而是根本没解析
Edge 16–18 支持 display: grid，但完全不认识 gap。你在 DevTools 的 Styles 面板里看到它显示为灰色或带删除线，Computed 面板查不到值，就是实锤——引擎压根跳过该声明，连报错都不会有。
别指望 grid-row-gap 和 grid-column-gap 能兜底：它们虽在 Edge 16+ 中可用，但必须成对出现；只写一个，另一方向间隙就归零。而且，如果同时写了 gap: 12px 和 grid-row-gap: 12px，旧引擎可能因解析冲突直接丢弃整条规则。
实操建议：
- 彻底删掉
gap，只用grid-row-gap和grid-column-gap，且两个都显式声明 - 避免混用新旧语法，确保源码中不出现
gap字样（否则 autoprefixer 不会为你转译） - 验证方式：打开 Edge 17 的 DevTools → Computed → 搜索
rowGap，确认值存在且非0px
Edge 12–15 完全不支持 display: grid，必须用 @supports 或 JS 检测分流
@supports (display: grid) 在 Edge 12–15 中无效，它会直接忽略整个块。你不能靠这个做降级，否则现代写法和 fallback 一起消失。
真正可行的方案是把 fallback 布局写在 @supports 外层，现代 Grid 写在里面：
.grid-container {
display: flex;
flex-wrap: wrap;
}
.grid-item {
width: calc(33.333% - 20px);
margin-right: 20px;
}
.grid-item:nth-child(3n) { margin-right: 0; }
<p>@supports (display: grid) {
.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 20px;
}
.grid-item {
width: auto;
margin: 0;
}
}</p>
注意：@supports (display: grid) 只能筛掉 IE 等完全不支持 Grid 的环境，Edge 12–15 会执行外层 fallback，Edge 16+ 才进入内层现代逻辑。
autoprefixer 对 Edge Grid 兼容性基本没用，别依赖它加前缀
autoprefixer 从 v9 开始就移除了对 Grid 属性的前缀支持，文档明确写着 “Grid is not prefixed”。它最多给 display: grid 加个 -ms-grid（仅限 IE10/11），但对 Edge 12–18 的 Grid 实现不做任何转换——因为 Edge 的标准 Grid 实现和 IE 的 -ms-grid 语义完全不同，强行加前缀反而导致布局崩溃。
实操建议：
- 检查你的
postcss.config.js，删掉grid: true配置，它对 Edge 无意义 - 不要在源码里写
-ms-grid-columns等 IE 专属语法，Edge 12+ 不认这个 - 若需兼容 IE11，必须手写两套：一套现代 Grid + 一套
display: -ms-grid，并用 JS 或条件注释加载
subgrid 在 Edge 所有版本都不支持，降级必须手动对齐轨道
subgrid 在 Edge 全系（含最新 Edge 127）中仍无支持。所有版本都会静默忽略 grid-template-rows: subgrid，计算值返回 none 或空字符串，导致子项完全脱离父网格线，布局错乱。
安全降级路径：
- 父容器必须用固定轨道定义，例如
grid-template-rows: 40px 1fr 60px（不能用auto-fit） - 子元素不用
subgrid，改用grid-row: 1 / 4显式跨三行 - 避免在父容器上用
display: contents，它会让子元素失去网格上下文，subgrid 直接失效 - JS 检测比
@supports更可靠：getComputedStyle(el).gridTemplateRows === 'none'可判断 subgrid 是否未激活
最易被忽略的一点：Edge 用户常混用 Chrome 内核印象，误以为新版 Edge 能跑 subgrid —— 实际上 Chromium 的 subgrid 支持（Chrome 115+）并未同步进 Edge 的渲染策略，至今仍未启用。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
