HTML & CSS · Junior · Question 13 of 75
What does box-sizing: border-box do?
- 1Draws an extra border around the element outside its
margin - 2Removes the element's
paddingandborder, leaving only content - ✓Correct answer: Includes
paddingandborderin the specifiedwidthandheight
Explanation
With content-box (the default), width sets only the content width, and padding and border are added on top: width: 200px + padding: 20px = 240px. With border-box, the total width is exactly 200px and the content shrinks. That's why many CSS resets apply border-box to every element. margin is never part of the size.