place-items 属于 css grid level 2，ie11、safari ≤10.1、chrome ≤56 等旧浏览器不支持，需用 -ms-grid-column-align/-ms-grid-row-align（ie11）或 justify-items/align-items（safari 10.1）降级，@supports 应检测 place-items: center 而非仅 display: grid。
place-items 不是所有 Grid 版本都支持的语法
它属于 CSS Grid Level 2 规范，而旧版浏览器（如 IE11、Safari ≤10.1、Chrome ≤56）只实现 Level 1，压根不认 place-items 这个属性名。它们能解析 display: grid，但遇到 place-items: center 就直接跳过——不报错、不警告、computed styles 里也看不到它生效。
IE11 和 Safari ≤10.1 根本没有 place-items 的概念
IE11 只支持 display: -ms-grid + 单独的 -ms-grid-column-align / -ms-grid-row-align；Safari ≤10.1 虽然支持 display: -webkit-grid，但没实现 place-items，连 justify-items 和 align-items 都不稳定。
- IE11 中写
place-items: center→ 完全无效，必须拆成-ms-grid-column-align: center; -ms-grid-row-align: center; - Safari 10.1 中写
place-items: center→ 解析失败，得退回到justify-items: center; align-items: center;，且需配合display: -webkit-grid - Autoprefixer 不会帮你转
place-items→ 它只处理 Level 1 属性，Level 2 的复合属性不在补全范围内
@supports 检测无法覆盖 place-items 的缺失
@supports (display: grid) 会通过，但 place-items 依然不工作——因为浏览器“认得 grid”，却不认“place-*”系列。真正有效的检测要锁定 Level 2 支持：
- 用
@supports (place-items: center)—— Safari ≤15.4、IE 全系直接不进块 - 更稳妥：叠加
@supports (display: grid) and (place-items: center)，避免半支持环境误入 - 注意：某些构建工具（如 UnoCSS 属性化模式）会把
place-items-center当作未知属性忽略，需手动加入safeList
降级时别指望 align-items + justify-items 自动 fallback
在现代写法中 place-items: center 等价于 align-items: center; justify-items: center，但旧浏览器对这两个 Level 1 属性的支持也不一致：
- IE11：
align-items和justify-items完全无效，必须用-ms-前缀 - Safari 10.1：
justify-items有部分支持，align-items在某些 writing-mode 下失效 - 真正可靠的 fallback 是 Flex：写在外层的
display: flex; justify-content: center; align-items: center;，而不是依赖 Grid 内部属性降级
place-items 的兼容性断层不是渐进式的，而是“全有或全无”。它不像 gap 至少还能靠 grid-row-gap 拆解，这个属性一旦不被识别，就彻底消失，连 warning 都不会留下。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
