Detailed Flexbox Tutorial for Complete Beginners #fullstackroadmap

This lesson is also on YouTube:

• Part 1
• Part 2
• Part 3
• Part 4

Prerequisites

• A basic understanding of HTML
• A basic understanding of CSS

The goal for this lesson

By the end of this lesson, you will:

• Be able to explain to someone what Flexbox is
• Understand how Flexbox can make your workflow faster and WAYYYY less frustrating
• Have a firm understanding of basic Flexbox syntax and patterns
• Build the following design with Flexbox:

What we are covering in this lesson

• What is Flexbox?
• What can Flexbox do for us?
• Simplify layouts in CSS
• Reduce reliance on media queries for responsive design
• Basic Flexbox Concepts
• Flex container vs. Flex items