All coursesCSS grid in Webflow
Turn a collection list into a responsive grid
We’re transitioning to a new UI, and are in the process of updating our Webflow University courses and videos.

Turn a collection list into a responsive grid

Create a Collection list and turn it into a responsive grid layout that adjusts to fit different screen sizes.

Turn a collection list into a responsive grid

Create a Collection list and turn it into a responsive grid layout that adjusts to fit different screen sizes.

1

Getting started

Coming soon

1

Grid
14:15
Grid
Coming soon

1

Fractional unit overview
2:35
Fractional unit overview
Coming soon

1

Flexbox vs grid vs Quick Stack
5:32
Flexbox vs grid vs Quick Stack
Coming soon

2

Grid examples

Coming soon

2

Span grid content
6:29
Span grid content
Coming soon

2

Turn a collection list into a responsive grid
5:25
Turn a collection list into a responsive grid
Coming soon

2

Overlap content in a responsive grid
4:18
Overlap content in a responsive grid
Coming soon

Course progress

0%

Up next

Overlap content in a responsive grid

Create a responsive grid layout with overlapping content. Change the overlap order while keeping the layout accessible.
Complete & continue
Complete course