Working with CSS- calc()
These days CSS has the ability to do some cool stuff like animations, gradients, transforms,
creating sophisticated interfaces with flexible box layouts etc.
In this blog we will learn how to use the calc() CSS function, which is very useful for calculation in CSS.
How to use it:
calc() allow us to use the mathematical formula within CSS with height, width and font-sizes etc. To measure we can use four maths operators add(+), subtract(-), multiply(*) and divide(/).
width:calc(100% / 4);
Uses of calc() function:
height:calc(100% – 40px);
It is supported by almost all modern browsers. On desktop version it supports IE 9+, Safari 6+.
For reference you can use the following link:
For browsers that don’t support calc(), use the following polyfill: