Goodbye floats and clearfixes. Hello flexbox.

Remember those old cartoons with the road runner and the coyote?

Rocket propelled rollerskates, bottled lightning, bundles of dynamite, magnetic bird seed — no technology could catch the bird. Every tool backfired and sent Wile E. Coyote plummeting to hillarious death.

Using CSS to layout your design is like trying to catch the road runner with a jet-powered pogo stick.

CSS sucks at layout

Nothing is more frustrating than writing a pile of code, refreshing your browser and seeing a jumbled mess of overlapping text and images.

You can't use tables because they aren't semantic. Floats and clears never do what you expect. Just to center something on the page requires strange incantations of negative margins and absolute positioning.

But you know what? This is old news. There's a new CSS module for layout in town called flexbox.

Flexbox makes CSS kick ass at layout

Once you spend some time with flexbox you'll feel like an unstoppable super hero of CSS.

Your footer will stay at the bottom of the page where it belongs.

Divs will shrink and grow and fly in delicate formations like the Blue Angels.

Image tags will dance and jump and sing songs of your design prowess.

Add Flexbox to your bag of tricks

Sign up for my FREE email course on flexbox and you will get:

• Five interactive video tutorials. (If you are a visual learner, you will love this format.)
• The Ultimate Flexbox Cheat Sheet
• A 22 page PDF walkthrough of flexbox, including three real world examples. (This is actually a sample chapter from my book, Sketching with CSS).
• Tips for how you can incorporate this modern technology into your workflow today.

What people are saying about the course

"Sean Fioritto has some great flexbox content lately with this cheat sheet and this fun interactive video thingy." — Chris Coyier

If you’re getting started with Flexbox this might interest you; An interactive video intro to Flexbox. http://t.co/3jJmdr3HtB

— Veerle Pieters (@vpieters) January 7, 2014

Well, @sfioritto just released the best example of flexbox layout I've ever seen. Amazing stuff. http://t.co/fWjZ0aXn7r

— Matthew Lehner (@matthewpearse) October 29, 2013

Had a crazy layout problem, had never used flexbox, and solved it in 20 min after watching these. Yessss. @sfioritto http://t.co/KZI2gIQEig

— donielleberg (@donielleberg) January 25, 2014

Who am I?

Hey there, I'm Sean, and I'm probably a lot like you. I make stuff for the web. My web dev skills are mostly self-taught over the last decade or so and I really love what I do.

Recently, I wrote a book on web development called Sketching with CSS. I'm also an author in Smashing Magazine and I've written some cool open source projects.

Today, I'm an entrepreneur. In the not so distant past I did the usual 9-5 thing doing web development for a couple big companies.

I'd love to meet you on Twitter. Follow @sfioritto