0

what is calc function in css

can anyone please say about the use of cacl() function in css

6th May 2020, 7:12 AM
Venkadesh. A
Venkadesh. A - avatar
2 ответов
+ 3
calc() function is used to calculate between viewports, percentages and pixels. For example if you have 2 div, first div is 100px height and you want second div to take all remaining place then you have to use calc() function to calculate remaining height. example : #div1{ width: 100%; height: 100px; background: green; } #div2{ width: 100%; /*100vh is total height of device - 100px which is height taken by div1*/ height: calc(100vh - 100px); background: red; }
6th May 2020, 7:23 AM
Raj Chhatrala
Raj Chhatrala - avatar
+ 1
Actually you can use it whenever you need to calculate something related to different units. for example : width: calc (50% - 10px); Here % and px different units are used. Because you don't know the result when you substrate 10px from 50% (it's not 40%). Hope it helps.
6th May 2020, 7:25 AM
Kashyap Kumar
Kashyap Kumar - avatar