在 calc() 中使用分数 (fr) 得到 "Invalid property value"
Using fraction (fr) in calc() gives "Invalid property value"
我正在尝试在使用 CSS 网格时在某些宽度上使用 calc()。所以我正在尝试的一件事是：
grid-template-columns: calc(1fr - 50px) calc(1fr - 50px);
因为我希望它是两个分数，但删除 50px，因为它用于填充等。但是，这样做时，Chrome 表示："Invalid property value".
不能calc()用于分数，还是我做错了什么？
fr 单位不是标准长度，例如百分比或像素。它只代表剩下的 space.
因此，fr 不能用在 calc() 表达式中。
§ 7.2.3. Flexible Lengths: the fr
unit
A flexible length is a dimension with the fr unit, which represents
a fraction of the leftover space in the grid container.
fr units are not lengths so they cannot be represented in calc() expressions.
但是你真的首先需要calc()吗？
fr 仅适用于剩余的 space，即 在 真实长度（例如宽度、边框、边距和填充）之后剩余的部分考虑在内。
考虑单独使用 fr。否则，post 有问题的完整示例。
我正在尝试在使用 CSS 网格时在某些宽度上使用 calc()。所以我正在尝试的一件事是：
grid-template-columns: calc(1fr - 50px) calc(1fr - 50px);
因为我希望它是两个分数，但删除 50px，因为它用于填充等。但是，这样做时，Chrome 表示："Invalid property value".
不能calc()用于分数，还是我做错了什么？
fr 单位不是标准长度，例如百分比或像素。它只代表剩下的 space.
因此，fr 不能用在 calc() 表达式中。
§ 7.2.3. Flexible Lengths: the
frunitA flexible length is a dimension with the
frunit, which represents a fraction of the leftover space in the grid container.
frunits are not lengths so they cannot be represented incalc()expressions.
但是你真的首先需要calc()吗？
fr 仅适用于剩余的 space，即 在 真实长度（例如宽度、边框、边距和填充）之后剩余的部分考虑在内。
考虑单独使用 fr。否则，post 有问题的完整示例。