CSS网格属性值无效

Question

在每晚的Chrome和Firefox中，设置此属性时都会出现以下错误：

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

Invalid property value

查看repeat()语法时，似乎输入正确吗？两种浏览器似乎仍能以某种方式使其正常工作，但奇怪的是我会遇到错误

Answer 1

问题在于， repeat() 需要两个自变量（表示repeat(auto-fill)无效）以及auto-repeat（{ {1}}或auto-fill）需要确定轨道大小：

  

auto-fit变体可以自动重复以填充空格，但需要确定的磁道大小，以便可以计算重复次数。它只能在跟踪列表中出现一次，但是同一跟踪列表也可以包含<auto-repeat>个。

definite value 的定义为：

  

无需执行布局即可确定的尺寸；也就是说，<fixed-repeat>，文本度量（不考虑换行），初始包含块的大小或<length>或其他公式（例如“ stretch-fit”大小）只能根据确定的大小解析的非替换块[CSS2]）。

同样，<percentage>无效，但是repeat(auto-fill, 1fr)有效。