Flexbox Simplified

Getting started with flexbox is easy. A nice little display: flex and you have columns.

Then it's time for the hard part: figuring out what strange combination of justifying, aligning, growing (or shrinking), you need to cobble together to get it to behave the way you need it to.

There are so many moving parts

As powerful as flexbox is, it can seem like it has a mind of it's own.

What to do if the columns are unbalanced?
Now these ones are balanced, but I need one to be bigger!
Why are things overflowing all of a sudden?
Is it align or justify… wait, neither are working?
What's the deal with growing and shrinking?!
Centering is supposed to be easy now right? But it doesn't always work!

Flexbox is a wonderful tool that opens up the world of responsive layouts, but it can be hard to predict exactly what's going to happen when we use it, and it's full of sometimes confusing property and value options.

Going from the very basics, we first break flexbox down, then build up our understanding with practical examples and code challenges .

Set up in a way to help reinforce earlier lessons as we continue to explore new content, this course is set up so that you are feeling confident with creating layouts with flexbox when you are done.

Lessons that break down how flexbox is working
Applying what you're learning to realistic examples
Challenges to reinforce what you're learning
Code snippets and design patterns you can easily plug 'n play into your projects
Cheatsheets that you can reference back to
Access to a private group within my Discord community to get help, show your progress, and ask questions
All lessons available for download for offline viewing
Finally understand how to take full control of flexbox and make it work for you