Image zooms in automatically

Hello,

I have a problem with a website I am making, the problem is that the image for my navbar keeps zooming in automatically even if I have the width lower than that of the div which contains it.

This is not a problem with max-width or min-width or anything like that as the image actively cuts out the left and right sides.

Is there anything I can do to fix this


Here is my site Read-Only: [LINK][https://preview.webflow.com/preview/scandinavian-black?utm_medium=preview_link&utm_source=designer&utm_content=scandinavian-black&preview=8eda1af597f75594ca6dc13619bed71b&pageId=606c8cdf182b3d2b64e98be0&mode=preview]
(how to share your site Read-Only link)

Welcome to the community @Re-do!

Can you please include your read-only link so I can take a closer look at how you’ve structured the project in the Designer?

1 Like

I took a look at your project and but I’m not sure I know why the image is cropping off at the sides as it looks fine in the Designer Preview.

Have you published the project recently? If so, can you try un-publishing and republishing the project? Sometimes that can fixes little quirks that happen when the site is compiled.

Other than that I’d recommend removing any styles from the image element itself and instead let it get the sizing properties from the link block wrapper instead. Images are pretty good at filling their containers size/shape so there may be some conflicting properties that are rendering strange in the live browser.

Since I’m not able to see the issue in the Designer myself, it’s hard to see if any of my solutions are solving the problem unless they’re published to the staging domain. If for some reason my suggestions don’t fix the issue, I’ll try and take another look at things with fresh eyes :+1:

Hey mikeyevin.

I tried your solutions but sadly none of them worked. After messing around I believe that the img tag zooms in automatically for no reason at all. Do you have any ideas or suggestions?

Are you noticing the issue on every image on the site or just that one? It may be something with that image specifically, so try saving out a fresh copy from your design software (if possible) and deleting/re-importing it to your project.

It’s hard for me to figure out the issue on my end as I still don’t see the problem in the Designer—only on the published site.