Margin, Padding, Gap
Learn all the ways to add spacing in your designs, the multiple techniques and the differences between them
10 lessons 27 examples 15 exercises
-
Lesson 1
What are margin and padding?
The essential of spacing in CSS
Free Lesson! -
Lesson 2
Directions
4 sides to every element
-
Lesson 3
Padding
The inner space
-
Lesson 4
Padding shorthand
All four directions at once
-
Lesson 5
Vertical Margin
The space above and below
-
Lesson 6
Horizontal Margin
The space on the sides
-
Lesson 7
Negative Margin
Moving elements closer
-
Lesson 8
Margin Shorthand
All four sides at once
-
Lesson 9
Gap
The flex or grid parent's space
-
Lesson 10
How to choose between Margin, Padding, and gap
Same purpose, different methods