box-sizing CSS property defines how the width and height of an element are calculated. By default, elements use the
content-box model, where padding and border are added to the width and height. If
box-sizing is set to
border-box, padding and border are included in the element’s width and height.
box-sizing: border-box; ensures the element maintains its defined height and width, even when padding and border are added.