Search code examples
javascripthtmlcsswebcalc

What is 100% in calc function

Within the css calc() function, what does 100% refer to and what is the equivalent code in JavaScript?

#div1 {
   width: calc(100% - 100px);
}

JSFiddle: https://jsfiddle.net/xoufnm6v/

Solution

  • 100% refers to 100% of the width of the parent element. This calculation gives the current element a width 100 pixels narrower than it's parent.