Question 1 of 6
Name the four box-model layers from the inside outward.
Start at the content and walk toward neighboring boxes.
The order is content, padding, border, then margin.
Quiz
Test your knowledge: The CSS Box Model
A short assessment covering the box edges, padding, margin, margin collapsing, and the boundary between Box Model and other CSS layout modules.
6 questions
~3 min
Beginner
Knowledge check
Test your knowledge: The CSS Box Model
A short assessment covering the box edges, padding, margin, margin collapsing, and the boundary between Box Model and other CSS layout modules.
- Stuck? Each question has an optional hint.
- Skip a hard question and review it before your results.
- Questions and answer options can shuffle between attempts.
You can retake this quiz whenever you like.
0:00
Question 2 of 6
What does padding primarily control?
Padding is inside the border.
Padding creates space inside the border around the content.
Question 3 of 6
What does margin primarily control?
Look outside the border edge.
Margin is outside the border and separates the box from surrounding layout participants.
Question 4 of 6
Two adjoining block-axis margins in normal flow are eligible to collapse. What does that mean?
Collapsing is specifically why adjoining margins do not always sum.
Adjoining margins can collapse according to the box-model rules rather than simply being added.
Question 5 of 6
Which lesson should own the detailed width, height, min/max, intrinsic-size, and box-sizing algorithms?
Box Model describes the edges; another CSS module calculates sizes.
CSS Sizing owns sizing properties and algorithms, including box-sizing and intrinsic sizing.
Question 6 of 6
A visible gap is outside both neighboring borders. Which box-model property should you inspect first?
Outside the border is the margin area.
A gap outside the border is margin space, subject to the relevant layout rules.
Quiz results
0/0
Review
-
Name the four box-model layers from the inside outward.Hint used
-
What does padding primarily control?Hint used
-
What does margin primarily control?Hint used
-
Two adjoining block-axis margins in normal flow are eligible to collapse. What does that mean?Hint used
-
Which lesson should own the detailed width, height, min/max, intrinsic-size, and box-sizing algorithms?Hint used
-
A visible gap is outside both neighboring borders. Which box-model property should you inspect first?Hint used