Streaming live at 10am (PST)

Grid or Flexbox for Lightbox video gallery? (mobile consideration important)

#1

I would like to make a video gallery which thumbnail posters - ideally want these to Flow in a grid layout as shown below

desktop 4 video posters in a row x any number of column
tables 3 video posters in a row x any number of columns
mobile 1 video poster in a row x any number of columns

I was hoping to use the Grid feature but on the mobile layout I can’t seem to be able to use 1 video poster in a row x columns -

Is there a better way to do this or I have I missed a function somewhere?

Any help advice would be most welcome - I got a large site from Adobe Muse which has a lot of video galleries that used to be used in a widget - as Webflow doesn’t have anything like this I need to be able to conceptualise how this might work.

Many thanks

Jay


https://preview.webflow.com/preview/mojo-pixels-test?utm_source=mojo-pixels-test&preview=086eb1e6718bc98f86e7d279fcfbbc41

#2

Hey @cheekyb. Not 100% sure I understand what you mean by you have been unable to use 1 video poster in a row x columns but I’m going to try and help.

Seems a though you’re using Grid correctly, even if you’re unable to change the column count on smaller devices you should be able to position children by the grid-column position rule. You can edit this through the Grid Child properties in the Style menu (Column start 1 /end 1) on the child DIV - not the parent Grid.

If you’ve successfully applied one column to mobile, giving your screenshot, it looks like the Lightbox Link child element is still positioned in the 2nd column (See the warning above your column settings) so edit this child DIV in the Grid Child properties as above (start 1/end 1) to set the breakpoint.

Does that help?

#3

Hello Paul sorry for the late reply,

I was playing around with Webflow yesterday and I figured out a simple way where I can just put my video image Lightbox posters as inline elements and centring them and that seems to work just fine so might use that right - I will try experimenting with grid layouts too but this seems ok for now.

Thank you so much for your advice I will keep this in mind when I try grid version of this.

Jay