css - Firefox:calc() 无效的属性值

Question

我有一个行高设置为 calc() 的元素:

line-height: calc(3rem / 2);

演示:http://codepen.io/Ghodmode/pen/vLxZZd

它在 Chrome 中工作正常，但 Firefox 的开发者工具说它是一个无效的属性值。

我确信我遗漏了一些显而易见的东西。

仅供引用:

• https://developer.mozilla.org/en/docs/Web/CSS/calc
• http://caniuse.com/#search=calc

Answer 1

这是一个已知问题。 Firefox 当前不支持接受长度或数字的属性的 calc() 值，其中 line-height 就是一个这样的属性。参见 bug 594933 .

由于 3rem/2 恰好是 1.5rem，您可以只硬编码该数量而不是作为解决方法。