SCSS:使用网格时会遇到编译错误:重复(自动拟合，Minmax(260px，1fr));

Question

我有有效的CSS网格规则

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px , 1fr));
}

但是，SCSS编译器带来以下错误：

编译错误 错误：MinMax(300px，1FR(不是整数。 ...>>网格 - 板块列：重复(自动拟合，minmax(300px，1fr((;

我可以使用unquote((函数跳过它，但是我很好奇为什么会发生这种情况。我在SCSS中做错了什么？

Answer 1

我认为问题是您的SASS版本，因为我使用版本 "node-sass": "^ 7.0.1"对我有用。

因此，如果您想保留您的SASS版本，我将代码工作我认为这是与PX中的值或功能中的值不兼容。对于en px值，您可能需要编写如下(我使用SCSS(的SASS代码：

grid-template-columns: repeat (auto-fit, minmax ((# {300px}), 1fr));

如果不兼容并且因为它不识别某些功能，请尝试以大写字母开头编写功能。

grid-template-columns: Repeat (Auto-fit, Minmax ((# {300px}), 1fr));