Streaming live at 10am (PST)

Images or divs that resize as browser window gets smaller


#1

Hi. Quick question. If you go to this site and make resize the browser window, you see that the images change size and shift...how is this done? It's different from a typical responsive site... Thanks!

http://www.samdallyn.co.uk/


#2

The images are taking up 100% of it's parent div. (possible in Webflow)

The div are the ones being resized at certain breakpoints. (possible in Webflow)

They are stacked in a container that has a maximum width. The stacking algorithm is based on masonry.js (possible using custom coding, or you can use flexbox)


#3

Thank you @samliew! Does flexbox do the relative easing and resizing as you
change the browser size? Thanks!!


#4

Depends on how you set it up. Flexbox is very customizable. Set a flex basis for the divs, then allow it to grow and shrink.


#5

This topic was automatically closed after 60 days. New replies are no longer allowed.