object-fit: cover crops an image to fill its container, which isn’t always what’s wanted if the full image needs to stay visible.
⚡ Quick Fix (TL;DR)
The Culprit: object-fit: cover crops an image to fill its container, which isn't always what's wanted if the full image needs to stay visible.
The Fix: Let the image scale to fit within its container without cropping, adding empty space on the shorter side instead.
.my-image {
object-fit: contain;
}
Rather not untangle this yourself? Our Done-For-You team handles exactly this kind of thing, start to finish.
See DFY options →
Was this helpful?
Thanks for the feedback!
Tagged in :