The box-sizing property is used to change the algorithm for calculating the width and height of an element.
According to the CSS specification, the width of a block is the sum of the content width, padding values, margins, and borders. The same is true for block height. The box-sizing property allows you to change this algorithm so that the width and height properties do not set the content dimensions, but the box dimensions.
box-sizing: content-box | padding-box | border-box | inherit;