I have been watching countless videos on css calc & I totally understand that calc does a simple calculation. I get that. I just can't wrap my head around of WHY would you use it. In what real world scenario? I feel like you can do the same things without calc for ex.

​

instead of

.content {height: calc(100% - 60px);}

can't you just do?

​

.content {height: calc(100% - 3%);}

(just find out what is 60px is in percents)

​

or just simply not do a calculation at all & just do

​

.content {height: 97%;}

​

Obviously calc() is useful, I just personally do not get it see the purpose of it. Can someone please help me wrap my head around calc.. what is it useful for.