0

これは私が直面してきた奇妙な癖です。これはレスポンシブ デザインであるため、最大幅 600 ピクセルのメディア クエリが適用された後、IE がコードを正しく適用しないようです。画像でわかるように、残りのすべてのブラウザーはこれを正しくレンダリングします。これは、すべての最新の IE バージョンに影響を与えています。IE9、IE10、および IE11 で確認しました。

誰かが同じ問題を抱えていましたか？それは私にとって謎です... IEの謎です！私はこのブラウザが「大好き」です...

HTML:

<figure class="animation-booking clearfix">
                    <img src="<?php bloginfo('template_directory'); ?>/casepages/d-reizen/images/animation-filter.jpg" alt="" class="hotel-filter">
                    <img src="<?php bloginfo('template_directory'); ?>/casepages/d-reizen/images/animation-holet-list.png" alt="" class="hotel-list js-hotel-list">
                    <img src="<?php bloginfo('template_directory'); ?>/casepages/d-reizen/images/animation-hotel-detail.png" alt="" class="hotel-detail js-hotel-detail">
                    <img src="<?php bloginfo('template_directory'); ?>/casepages/d-reizen/images/animation-best-deal.jpg" altz="" class="best-deal">
                    <img src="<?php bloginfo('template_directory'); ?>/casepages/d-reizen/images/animation-small-screen.png" altz="" class="booking-small">
                    <figcaption class="icon-load icon-arrow">Filteren en meer informatie over je bestemming. Allemaal op dezelfde pagina.</figcaption>
                </figure>

CSS:

@media only screen and (max-width: 600px){
    top: 85px;
    left: 175px;
    -ms-transform: rotate(290deg) scaleX(-1);
    -webkit-transform: rotate(290deg) scaleX(-1);
     transform: rotate(290deg) scaleX(-1);
     font-size: 2em;
     position: absolute;
     font-family: 'icomoon';
     speak: none;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     line-height: 1;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
}

その他のブラウザ: ここに画像の説明を入力

IE9+: ここに画像の説明を入力

4

1 に答える 1

0

私はすでに私の問題を解決しました。なぜこの問題が 600px 未満の IE でのみ発生するのかを理解する時間はありませんでした。

はい、ハッキングは使用しないか、少なくとも最大限に回避する必要があります。

どうぞ：

@media screen and (max-width:600px) and (min-width:0\0) {

}

ターゲットは(min-width:0\0)IE9+ です。

于 2014-02-27T18:49:16.493 に答える