Raghavendra Prasad Raghavendra Prasad - 28 days ago 4x
CSS Question

Calc() function inside another calc() in CSS

How do I use a CSS calc function inside another CSS calc function? according to this post ("https://developer.mozilla.org/en-US/docs/Web/CSS/calc") it is possible but there is no example of that.


It is possible to use calc() inside another calc().

An example:

  width: calc(100% - (1% + 30px));/* calc(1% + 30px) is nested inside calc()*/
div p{
  width: calc(100% - 30px);/*100% is total width of the div*/