Hi everyone,
Been struggling a bit here for the last few days with this CMS image issue and I’ve been losing my mind over it.
For some reason when I load in a multi-image collection set, the images look great in the designer but when published the images seem to get scaled down and then back up. All my images are just a bit larger than the image width set on the image element and a px number has been set on the element as well. From what it looks like, it appears Webflow is providing the 500px width version and then my CSS is scaling it BACK up to the width I’ve set. (check screenshots).
Looks fine and checks out in the editor
Once the page is published is where things get weird (check the intrinsic and rendered sizes)
The weird thing is this only happens if I mess with the class after I uploaded images into CMS entries. In the links below, you’ll notice that it only happens to the first group of images (first project section), but the rest are totally fine despite using the same exact layout and classes.
For the life of me, I can’t figure out Webflow’s logic on this and why it would be forcing a smaller image than what the CSS has dictated. Is there a way to overwrite or maybe a CSS workaround?
Here is my public share link: Webflow - Stalla Design
Link to staging site - Futr Events | Creating the FUTR of live events | Stalla Design
