Internet Explorer 11 设计问题

Question

我得到这个

我想要输出像

代码在这里：

<div class="row col-sm-12 cms-img-fix cms-pdT25">

                <a class="cms-pdB50" href="https://www.radise.com/" target="_blank">
                    <img class="img-fluid" src="/images/base-images/RADISE_logo@2x.png">
                </a>
                <a class="cms-pdB50" href="https://www.testpile.com" target="_blank">
                    <img class="img-fluid" src="/images/base-images/AFT_0001_LOGO_HOR_WEB.png">
                </a>
                <a class="cms-pdB50" href="http://smart-structures.com/" target="_self">
                    <img class="img-fluid" src="/images/base-images/Group 16.png">
                </a>
                    </div>

我在 Internet Explorer 11 中遇到了设计问题，但在 chrome 设计中它很完美。

在公司 div 中，我在第三张图片中遇到问题

请打开以下链接

https://smart-structures-dev.azurewebsites.net/

在 chrome 和 Internet Explorer 11 中，然后检查您在下图中观察到的差异的公司图片

<img class="img-fluid" src="/images/base-images/AFT_0001_LOGO_HOR_WEB.png">

谁能帮我解决这个问题

Answer 1

我尝试使用 IE 11 浏览器检查您的网站。 我检查了源代码和 CSS。

我发现您正在使用 flex。 CSS flex与 IE 浏览器存在一些问题。 在许多情况下无法正确计算高度和宽度。

我注意到在您的 CSS 代码中，您为那 2 个图像使用了max-height和max-width 。

如果换成最大宽度与宽度和更换最大高度与身高的问题是可以解决的。

width: 100%;
height:100%;

进行上述更改后在 IE 11 中的结果：