How can I fill a div with an image while keeping it proportional?

Question

I found this thread — How do you stretch an image to fill a

while keeping the image's aspect-ratio? — that is not entirely the thing that I want.

I h

相关标签:

Answer 1

This should do it:

img {    
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
}

Answer 2

The CSS object-fit: cover and object-position: left center property values now address this issue.

Answer 3

Try this:

img {
  position: relative;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  transform: translateX(-50%);
}

Hope this helps