Can anyone tell me why images in my center column won't display correctly?

For reference I have included an image. For context I can say I have just no idea why it is presenting as the incorrect size. I haven’t touched any responsive settings, gone so far as to duplicate the first column to make sure there is no difference in the settings between the columns. My tree looks like Columns - DIV block - Image.

Anyone know how to make this configuration work? Is there a better way to do this?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

There are two links at the bottom of your post. The last one explains how to add a read-only link. Please do.

1 Like

https://preview.webflow.com/preview/rocky-mountain-final?utm_medium=preview_link&utm_source=designer&utm_content=rocky-mountain-final&preview=a617d9142774692fb45585d3d865bb36&workflow=preview

Hey @kObe , your images are very different sizes, e.g. your rightmost one is 650x838, and your center one is 326x447. They’re just displaying naturally, as you’ve set them.

Note that under assets you have quite a few versions of that center photo, and some are the right size. You can just select your image and choose a larger version…

image

BUT there is a far better layout approach to what you’re trying to do.

Since you never know how tall or wide the browser window will be, you’re probably better off maximizing your containing image DIVs and setting the art as the background instead. That way your images will always cover the entire space perfectly, no matter how big the window is.

Give me a few mins to finish some emails, I’ll add a vid to show you how this works.

Here you go.

Awesome! I’ll check it out immediately and get back to you if it works out for me. Thanks for the advice!