Hi,
I’m having an issue with image sizing. I wanted to lock the image size so no matter what image I add, it stays the same size. I also added a circle or line around the image. When I replace the image, the image and circle/line around the image becomes more oval like than an circle.
How can lock the image size? So the image in the circle stays the same?
Here is my site Read-Only: LINK
Why don’t you make a div that is set to the correct width and height with the correct corner radius and then set the image as a background set to cover?
Thank you! But do you know how this would work with a styling an image from a collection so it does it to all images?
Select your div that you want to apply the background image and go into the settings for the div where you can select the cms items it pulls from. You’ll see get BG image from… Select that and you can then to into the regular styling area for background image and you can set the positioning and set it to cover there.
You would need to add the CSS property “object-fit” and set it’s value to “cover”. Good news is Webflow now has this property which you can see below:
In the size section you can explicitly give the dimensions you want to the image element. Then where it says “Fit” you can select the option “Cover” so it always fills the image element properly without warping or stretching.
Hope this helps!
Dear @Noah-R , Thanks so much!
Finally we found solution!!!
