Bootcamp
Search…
CSS.3: Flexbox

Introduction

​Flexbox is an alternative and often more convenient system for CSS layout.
Also see the section on column layouts using flexbox here.​

Distributing Boxes

One of best features of flexbox is it's ability to distribute boxes across the available space in intuitive ways. It's very easy to visually explain the ways that flexbox will do this.

Align Content

Align Items

Justify Content

Exercises

Position and Distribute Elements Using Flexbox

Don't worry too much about the end sections of the exercise. We won't be using things like order very often.

Further Reading

Game that teaches flexbox: https://geddski.teachable.com/p/flexbox-zombies​
Copy link
On this page
Introduction
Distributing Boxes
Align Content
Align Items
Justify Content
Exercises
Position and Distribute Elements Using Flexbox
Further Reading