Streaming live at 10am (PST)

Dynamic List - Masonry Style Layout


#1

I'm trying to lay out a masonry style page with a dynamic list. Is this possible? it looks like the multi-column options with a dynamic list behave differently from the standard column element.

This is what I'd like my page to look like: (2 dynamic lists, each inside columns)

This is what it looks like when I use the 2 column format of the dynamic list:

is there a workaround for this, or are the columns just not the same?

Here's a link to my site, the page I'm looking at is called 'quotes'

https://preview.webflow.com/preview/intradiemnew?preview=f9f17fdd0ff056c034ea19415df33ec6


Build a layout with masonry-style?
#2

One of the solutions (I think there could be more):
1) add 2 columns row to the container
2) add dynamic list to every column, but limit elements: 1st column= 1-4, 2nd column = 5-9
3) show dynamic list itself not like columns, but like elements stuck on each other.
Here is result:

Regards,
Anna


How to apply a masonry style to elements on a page
#3

Yeah, that's one of the solutions that I had come up with, but I suppose with the new 'pagination' feature it will work.

I guess I should look at the dynamic lists columns as wholly separate in functionality from the standard columns. I've already had to do that with how they act in different breakpoints. Do you know if there's any plan to make them behave more like the columns element in the future?

Adding this, for example, would make sense:


#4

I don't know, unfortunately. But you can suggest this option on Wishlist. I am sure Webfow staff checking on it pretty regular :smiley:


#5

That was my next step, but I'm sure they have a lot more important things than this on their lists. It's a nice to have for sure.


#6

this is exactly what I need!


#7

Hey guys, just wanted to let you know, I found out pretty nice way to create Masonry layout by using CSS. Thought maybe you will be interested.
More information you can found in this topic: http://forum.webflow.com/t/masonry-grid-pinterest-in-webflow-created-by-css-only/21693

Regards,
Anna


#8

#9