Функция cacl() можно использовать для определения высоты или длины. Эта функция является уникальной так как позволяет делать расчеты непосредственно в CSS.
Простой пример:
div {
width: calc(100% - 50px);
}
Также можете делать более одного расчета в пределах одной функции.
В спецификации , определено что выражения умножения и деления имеют приоритет над вычитанием или сложением.
div {
width: calc(100% - 50px + 2px*2);
}
Наряду с некоторыми другими свойствами CSS3, функция calc() является одним из тех элементов CSS, которые могут действительно сделать жизнь верстальщиков легче.