Building CSS grid layouts in Webflow

This course introduces you to the basic concepts of grid, including how it compares to and works alongside other layout options like flexbox.

4
 Video Lessons
Intermediate
11min

About this course

From the beginning of time, CSS layouts have been plagued by complexity. No more. While flexbox is optimized for organizing content along one dimension, grid enables you to quickly build layouts in two dimensions. In this course, we'll cover the basic concepts behind grid as well as some of the new terms unique to the topic.

Assets

Looking for the assets used in this course? We put all the magic inside a zip file, and you can find it 

right here
.

Requirements

  • Free (or paid) Webflow account — sign up
  • Chrome or Safari browser
  • Class D fire extinguisher

Course outline

Intro to grid

1:23

Grid layouts overview

2:42

The FR unit

2:35

Flexbox vs. CSS grid

4:00

4
 video lessons
Intermediate
11min