Flexbox
Learn how to use the Flexbox system to create layouts
12 lessons 34 examples 26 exercises
-
Lesson 1
What is Flexbox?
An overview of what Flexbox is
Free Lesson! -
Lesson 2
Flex Container and Flex Items
The two components of a Flexbox layout
-
Lesson 3
Flex Grow
Making use of the remaining space
-
Lesson 4
Flex Shrink
When there isn't enough space
-
Lesson 5
Flex Basis
What value the calculations are based on
-
Lesson 6
Flex Direction
Choosing in which direction the Flexbox items go
-
Lesson 7
Flex Wrap
From one line to multiple lines
-
Lesson 8
Gap
The space between
-
Lesson 9
Justify Content
Using the space along the main axis
-
Lesson 10
Align Items Align Content
Along the cross axis
-
Lesson 11
Order
Re-order with CSS
-
Lesson 12
Shorthand Properties
One property to rule them all