Dear all,
I tried to make an img object-fit via CSS rule, but it doesn’t behave like I’d expected it. Here is my CSS:
I expect, that the img -- regardless of portrait or landscape and it’s pixel dimensions -- is proportionally scaled up or down to fill the complete width and height of 82x80mm and is centered horizontally and vertically.
But what I get is a distorted image as if I’d never defined an object-fit. What am I doing wrong?
Thanks, Tobias
I tried to make an img object-fit via CSS rule, but it doesn’t behave like I’d expected it. Here is my CSS:
.theImgWrapper {
position: absolute;
top: 71mm;
left: -15mm; /* img starts in bleed */
width: 82mm;
height: 196mm;
}
.theImgWrapper img {
width: 82mm;
height: 80mm;
object-fit: cover;
object-position: 51.183% 50%; /* respecting bleed of 3mm on a left page */
}
I expect, that the img -- regardless of portrait or landscape and it’s pixel dimensions -- is proportionally scaled up or down to fill the complete width and height of 82x80mm and is centered horizontally and vertically.
But what I get is a distorted image as if I’d never defined an object-fit. What am I doing wrong?
Thanks, Tobias