Vince Vince - 1 month ago 16x
CSS Question

Firefox: calc() invalid property value

I have an element with a line-height set with


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


It works fine in Chrome, but Firefox's Developer Tools says that it's an invalid property value.

I'm sure I'm missing something that should be obvious.

Just for reference:

Thank you.


This is a known issue. Firefox does not currently support calc() values on properties that accept either lengths or numbers, of which line-height is one such property. See bug 594933.

Since 3rem / 2 is exactly 1.5rem you can just hardcode that amount instead as a workaround.