Image crop at the wrong position

Could someone please tell me why the images is not showing the correct part of the image. The ‘position’ option under the 'size section has no effect on the image. I want the div to show the bottom part of the image. Could someone please show me what Im doing wrong?

Read only link
[2]: https://university.webflow.com/article/sharing-your-sites-read-only-link

Hi Warren!

As mentioned in the spec the element should have a width and height set in order to make object-fit and object-position work as expected:
https://drafts.csswg.org/css-images/#the-object-fit

In the case of the image you’re using in your page, it’s height is set to auto right now, you should give it a height of 100%.

Give that a try and hopefully this helps.

1 Like