The Box Model
In this course, you will learn how to use the Box Model to position HTML elements on your web page.
Start
Key Concepts
Review core concepts you need to learn to master this subject
CSS Margin Collapse
CSS auto keyword
Dealing with overflow
Height and Width Maximums/Minimums
The visibility Property
The property box-sizing of CSS box model
CSS box-sizing: border-box
CSS Margin Collapse
CSS Margin Collapse
/* The vertical margins will collapse to 30 pixels
instead of adding to 50 pixels. */
.block-one {
margin: 20px;
}
.block-two {
margin: 30px;
}CSS margin collapse occurs when the top and bottom margins of blocks are combined into a single margin equal to the largest individual block margin.
Margin collapse only occurs with vertical margins, not for horizontal margins.
The Box Model
Lesson 1 of 2
What you'll create
Portfolio projects that showcase your new skills
How you'll master it
Stress-test your knowledge with quizzes that help commit syntax to memory
The Box Model
Start