1
HTML/CSSBeginner#css#box-model
HTML/CSSBeginner#css#box-model
What is the CSS box model?
Every element is a box composed of content, padding, border, and margin, from inside out. box-sizing: content-box (default) excludes padding/border from the declared width, while border-box includes them, making sizing more predictable.
Example
* { box-sizing: border-box; }
.box {
width: 200px;
padding: 20px;
border: 5px solid black;
/* total width stays 200px with border-box */
}