Streaming live at 10am (PST)

Image thumbnails (row of 4) that fill browser window?


#1

Hi folks,

Just trying to find the best way of working inside of Webflow.

With this question - I have 4 image thumbnails in a row (not inside a container, but a full width section), and all butt up against each other (no space between theme), is this achievable with Webflow?

Many thanks


#2

So... 4 images one next to each other and they all are in the full width section? If so use another div and set it's height to 100% and width to 25%. Copy and paste 3 times so you have 4 instances of that div. Now set background of this divs to what you want or place images inside of them.


#3

That works great. Just like hand-coding wink Was not sure if Webflow had a 'special' way of doing it!! Still just playing around with it.

Thanks again for the prompt response bartekkustra wink


#4

Marc you can also drop a column structure into the body, give each column a class and remove their left and right padding (columns come default with left and right 10px padding). Then drop images into each column. That's another option.


#5

Thanks Sergie, will give that a go. Bartekkustras tip unfortunately looked screwy once I'd exported, and fired it back up in Chrome.

I was trying to attempt the effect as seen on this site - example site


#6

Yeah you can use columns and have the same sized images in each column, or use background images (cover) if they are different sized images (but you would have to set a height on that background image div block.


#7

This is very easy using floats for your image blocks. Check out the video http://tutorials.webflow.com/floating-and-clearing-elements-in-webflow


#8