0

当我更改浏览器窗口的宽度时,图像不会在 IE 11 或更低版本上缩放。我确实使用谷歌浏览器。我试图添加位置:绝对,但它破坏了整个布局。
图片CSS:

.auction-item-img-container {
  display: block;
  height: 400px;
  overflow: hidden;
  position: relative;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
@media screen and (max-width: 1024px ) {
  .auction-item-img-container {
    height: 0;
    padding-bottom: 100%;
  }
}
@media screen and (max-width: 480px ) {
  .auction-item-img-container {
    height: 270px;
  }
}

Parent 和 img 都有display: block; box-sizing: border-box;
HTML:

<article onclick="AddCookieWithAuction(1185)" id="auction-1185">
<a class="auction-item-img-container" href="/Aukcje/PodgladAukcji/1185/1/1" style="background-image: url(/Content/images/backgrounds/empty.png)"> </a>
<!-- This part is responsive -->
<div class="auction-item-desc">
    <div class="auction-bar">
        <h4 class="auction-bar-author"><a href="/Aukcje/PodgladAukcji/1185/1/1">1</a></h4>
        <h5 class="auction-bar-title"><a href="/Aukcje/PodgladAukcji/1185/1/1">1</a></h5>
    </div>
    <div class="auction-price-container">
            <div class="actual-price-holder">
                    <span class="auction-price-label">Cena</span>

                <p class="auction-price"><a href="/Aukcje/PodgladAukcji/1185/1/1">123 PLN</a></p>
            </div>
                        <div class="auction-observe">
                <a onclick="acc.onObservedButtonClick(1185, this)" class="fa fa-star-o observe-icon"></a>
                <a onclick="acc.onObservedButtonClick(1185, this)" class="add-observe">Dodaj do obserwowanych</a>
            </div>
    </div>
    <div class="auction-type-container">
        <span class="auction-type"><a href="/Aukcje/PodgladAukcji/1185/1/1">Aukcja w trakcie</a></span>

    </div>
</div>
</article>

它在两种浏览器上都是如此。 图片

4

2 回答 2

0

参加聚会可能有点晚了,但我发现了另一个可能对您有帮助的 SO 答案:https ://stackoverflow.com/a/42174237/1914261

IE11 似乎对flex-shrink 属性的初始值有些问题。如果将其设置为零(最初设置为 1),它应该可以工作

于 2017-08-01T11:27:27.110 回答
0

我建议您在这里查看您的布局和所有移动设备,您的网站在所有设备上都可以正常运行。通过调整屏幕大小在 Internet Explorer 中观看您的布局是没有意义的。

于 2016-08-01T10:17:18.293 回答