Internet Explorer中的图像缩放使图像按宽度按下

Question

我正致力于在我的课程中创建一个创建响应式图像的后备图像，但我仍然坚持尝试修复IE的问题。由于我无法使用<source>，object-fit和srcset之类的内容，因此我遇到了挑战。图像放在内容下方，因此它将调整为div内容的高度。图像应该覆盖包含内容的div的整个背景，但问题是宽度会将图像压缩到看起来很糟糕的紧凑尺寸：

我会为你提供一个jsfiddle：https://jsfiddle.net/6Lxwesvf/7/。 我制作了一个包装器的副本，它完全按照它在IE中的作用完成。所以我希望有人知道如何使图像看起来不被宽度按压。

Answer 1

更改此

height: 100%;

到此：

min-height: 100%;
min-width: 100%;
margin: auto;

工作笔：https://codepen.io/sidhanshu28/pen/ERNwxz