CSS Properties

Box-sizing Properties

The box-sizing property tells the browser what the sizing properties should include. We can set this property to content-box (default) or border-box.
The box-sizing property is used to include the padding and border in an element's total width and height.

Example:

div {
box-sizing: border-box;
}

  • content-box - The width and height properties (and min/max properties) includes only the content. Border, padding, or margin are not included.
  • border-box - The width and height properties (and min/max properties) includes content, padding and border, but not the margin.
Cristle Academy

Compiler