CSS: Using Flexbox for Layout (Interactive)

Follow the clues behind each property of Flexbox and learn how to make modern layouts that are flexible across different screen sizes.

Get started Preview course

What you'll learn

Follow the clues behind each property of Flexbox and learn how to make modern layouts that are flexible across different screen sizes. This interactive course was formerly known as Cracking the Case With Flexbox on Code School.

Try this course for free

Access this course and other top-rated tech content with a free trial.

Free individual trial Free team trial

Have questions?

Get them answered now.

Start a live chat

Course Info

Rating

(11 reviews)

Level

Beginner

Last updated

Oct 28, 2021

Duration

32m

Foreshadowing Flexbox | 4m 38s
Challenge: Creating Flex Containers | 10s
Challenge: Starting a Grid | 10s
Challenge: Creating Inline Flex Containers | 10s
Challenge: Flexing Form Elements | 10s
Wily Wrapping | 3m 50s
Challenge: Wrapping Media Content | 10s
Challenge: Wrapping Grid Items | 10s

Justice in Justifying | 3m 18s
Challenge: Distributing Space Around | 10s
Challenge: Distributing Space Between | 10s
Challenge: Justifying Column Content | 10s
Challenge: Aligning Inline Items | 10s
Order in the Flexbox! | 1m 43s
Challenge: Alternating Order | 10s
Challenge: Order by Class | 10s

CSS: Using Flexbox for Layout (Interactive)

What you'll learn

Table of contents

Foreshadowing Flexbox 9m

Justification and Order 6m

Aligning Alibis 3m

Sizing Up the Properties 8m

Property Plotting 5m