Streaming live at 10am (PST)

(SOLVED) Set Collection List's columns based on breakpoint?


#1

Hi there,

I was wondering if there was a way, to set the number of columns of a collection list based on the webflow breakpoints (desktop, tablet and mobile phones) ? I tried to change the layout setting of my collection list from three columns on desktop to two columns on ipad… it works great the ipad has two columns but when coming back on desktop, the desktop version kept the two columns layout.

Here a small screen video

read only link

Thank you ! :slight_smile:


Here is my public share link: LINK
(how to access public share link)


#2

Hi @anthonysalamin

I imagine there’s a few different ways to achieve this. Here’s how I would do it based on what you have created already…

1. Set the Collection List layout to full width
image

2. Style ‘Collection Item’ for Desktop:

3. Tablet:

4. Mobile

Let me know how you get on?

Thanks


#3

That’s awesome !!! Thank you @marsh !!

Just followed your technique and it works beautifully !
Thanks alot ! :slight_smile: