CSS网格属性值无效答案

【问题标题】：css grid property value invalidCSS网格属性值无效
【发布时间】：2018-08-30 22:33:28
【问题描述】：

在 Chrome 和 Firefox nightly 中，设置此属性时出现以下错误：

grid-template-columns: repeat(auto-fill);
grid-template-rows: repeat(auto-fill, 1fr);

Invalid property value

查看repeat() 语法时，我似乎输入正确？两种浏览器似乎仍然以某种方式使其工作，但我得到一个错误似乎很奇怪

【问题讨论】：

【解决方案1】：

问题在于 repeat() 需要两个参数（意味着 repeat(auto-fill) 无效）以及 auto-repeat（auto-fill 或 auto-fit ) 需要确定轨道大小：

<auto-repeat> 变体可以自动重复以填充空间，但需要确定轨道大小以便可以计算重复次数。在曲目列表中只能出现一次，但同一个曲目列表中还可以包含<fixed-repeat>s。

而definite value定义为：

无需进行布局即可确定的尺寸；也就是说，<length>，文本的度量（不考虑换行），初始包含块的大小，或<percentage> 或其他公式（例如未替换的“拉伸适合”大小块 [CSS2]) 仅针对确定的大小进行解析。

因此，repeat(auto-fill, 1fr) 无效，但 repeat(auto-fill, 100px) 有效。

【讨论】：