Problem with image resizing in CMS collection list

Design help CMS
1

Hi guys,

I have a very strange thing going on:
For whatever reason Webflow resizes my images in a collection list in the published version.
I have isolated the problem and stripped it down to the bare minimum (only the image in the list, no css at all in the collection) added fresh entries in the collection, still the same issue.

I´m trying to figure it out for hours already, without success …

Any help would be much appreciated!

Here is my public share link:
https://preview.webflow.com/preview/bau-satz?utm_medium=preview_link&utm_source=designer&utm_content=bau-satz&preview=edaf99ef9a483c1d4dce4242e33f5f1a&pageId=637f8684839d6b473bba9360&workflow=preview

Here is the published version:
https://bau-satz.webflow.io/test

Thanks a lot! :pray:t3:
Manuel

2

Hey Manuel,
you need to set the image width to 100%. The max-width only tells them how much width they could get but does not define the width itself.

1 Like
3

Hi @T_Blumenbecker ,

thanks – but it´s not a css issue, there is no css added in my test link, the images should just take the space they have (as long as the container is not bigger than the image, which is not the case).

The thing is, when publishing Webflow places smaller versions for some images for whatever reason.

But: I found a solution already – I have rebuilt it and use embed code for some elements, this way it works. Still don´t understand it though.

Cheers,
Manuel

4

Well, that determination is made by the browser, and includes factors such as nearest IMG srcset size, image aspect ratio, container size at the point it chooses the image…

Like Thore said, if you set the image size to 100%, that declares to the browser what size you want the image at, and then it will choose the nearest srcset variant and make it work declaratively.

1 Like
5

Uh @memetican, now I got it – you guys are right of course! I did not know that Webflow is creating several versions of an image and then the browser chooses from those. “Normally”, if there would be only one image, the browser would have only 1 choice, that´s why I thought it cannot be the width.

Thanks anyway!

All the best,
Manuel

1 Like