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，因此您可以硬编码该数量作为解决方法。