Learn Flexbox

This tutorial teaches you CSS Flexbox through 12 interactive screencasts. You'll learn all the key concepts in addition to building a responsive navbar and a neat image grid.

• Flexbox Basics
• Main axis
• Cross axis
• Justify content
• Positioning items
• The flex property
• Align items
• Flex direction
• Wrapping
• Flex grow, shrink, basis
• Order
• Creating Navbar
• Creating image grid

• Learn Flexbox
• 1. Your first Flexbox layout - Flexbox tutorial
• 2. Main axis and cross axis - Flexbox tutorial
• 3. Frontend Career Path
• 4. Justify Content - Flexbox tutorial
• 5. Positioning items - Flexbox tutorial
• 6. The flex property - Flexbox tutorial
• 7. Align items - Flexbox tutorial
• 8. Flex direction column - Flexbox tutorial
• 9. Wrapping - Flexbox tutorial
• 10. Flex grow, shrink, basis - Flexbox tutorial
• 11. Order - Flexbox tutorial
• 12. Bonus: Responsive Navbar - Flexbox tutorial
• 13. Bonus: Creating a Flexbox image grid - Flexbox tutorial
• 14. Congrats & next steps!