Grid of thumbnails with three different size images (Desktop only)

Hey there

Trying to figure out the best way to use three different size thumbnail images within a grid at the Desktop view…would like to change to single (small) size with other devices. I currently have a comp of what I’d like it to look like in the background of the body for reference.

I’ve tried it with the Webflow column feature but I ended up with a big nested mess.

Without the column feature I’m ending up with a dead area to the right of the large image in the second row.

Would really appreciate any help you folks can provide.

troy

https://preview.webflow.com/preview/troyyung30090113?preview=a75ca910b26ed3d94a010b07d58221e6

i think “masonry” is the term you’re looking for.

there is no easy way to do this inside of webflow. :frowning: You’ll need to use a third party script to help you out.

Let me know if this is what you are looking for. If so, when I get some free time, I’ll make a video tutorial on how to go about doing something like this. :smile:

Thanks PixelGeek!
It’s had for me to say if this problem (or solution) you point to is really what I’m looking at…it’s close for sure.

I just reworked a column version that may be ok assuming I can call a change in image size with smaller devices.

https://preview.webflow.com/preview/troyyung3009011318025142?preview=83ad74d2bd501c445fea19eedccb0731

If you get a chance take a quick look and let me know if this is going to cause problems I’m not aware of.

Thanks again for the help!
troy

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.