Calc allows you to calculate values using mathematical expressions with addition +, subtraction -, multiplication *, division /. You can combine values with different unit values such as em, px or %.
You can use calc where ever length, angle, frequency, time or numbers are used.
The result must be within the allowable range for the property.
Space is required around plus + and minus - symbols.
Great potential for calculating widths in layouts where one value is fixed and others are unknown.
- Live Example
- Play with the code in the textarea below.
- Introduced in CSS version
- Applies to elements
- where length, angle, frequency, time or numbers are used
- Browser Support
Browsers IE Firefox Safari Opera Chrome Versions 9 -moz- 8 -webkit- 5.2 -webkit- 19
See the full list CSS properties and browser support: CSS Properties