minmax() 仅在 grid-template-columns 中配合 repeat(auto-fit/fill) 时生效；单独使用、位置错误或子项尺寸失控均导致失效，常见原因包括声明位置错误、可用空间为0、内容溢出及不合法参数组合。
minmax() 本身不实现自适应列宽，它只在 grid-template-columns 中配合 repeat(auto-fit) 时才起作用；单独写、写错位置、或子项尺寸失控，它就完全失效。
为什么 minmax(250px, 1fr) 常常没反应？
这不是浏览器 bug，而是轨道定义没被真正“激活”：
- 写在
width、grid-column或非 Grid 容器上 → 浏览器直接忽略整条声明 -
grid-template-columns缺失，或父容器是display: inline-grid且没设width→ 可用空间为 0，1fr分不到任何值 - 子项内有长单词、URL 或图片没加
max-width: 100%→ 强制撑宽，1fr失去伸缩余地 - 子项设置了
min-width: fit-content或white-space: nowrap→ 同样锁死宽度，minmax()的上限形同虚设
repeat(auto-fit, minmax()) 和 repeat(auto-fill, minmax()) 差在哪？
区别不在“填不填满”，而在“空轨道是否占空间”：
-
auto-fit：生成轨道后，把没内容的列塌缩掉，剩余空间由有内容的列均分 → 卡片布局首选，视觉紧凑 -
auto-fill：不管有没有子项，都按最小宽度硬生成所有可能轨道 → 表单栅格、日历槽位等需要对齐的场景才用 - 实测中，
auto-fit在小屏下更可靠；但若容器宽 600px、minmax(250px, 1fr)，auto-fill会生成 2 列轨道（500px），留出 100px 空白；auto-fit则让这 2 列各占 300px
哪些参数组合实际会静默失败？
浏览器不会报错，但会回退到默认行为（比如变成单列或固定列）：
-
minmax(200px, auto)→auto不是合法最大值，整个函数被丢弃 -
minmax(200px, 2fr)→2fr在minmax()的最大值位置无效，仅1fr被接受 -
minmax(2rem, 1fr)→ 字体缩放时 rem 变化，列数计算失准，推荐用clamp(160px, 25vw, 300px)替代最小值 - 漏掉
gap单位或用了margin→margin侵占子项自身宽度，破坏1fr均分逻辑，尤其小屏易溢出
真正难调的不是写法，是隐式耦合
改一个值，可能同时影响列数、列宽、换行位置和视觉节奏。比如把最小值从 250px 改成 300px，在 320px 宽手机上就只剩一列堆叠——它其实完全符合规则，只是你没意识到这个“最小值”已经卡死了列数下限。调试时得同时看容器宽度、子项内容尺寸、gap 大小和父级约束，缺一不可。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
