8

IE9で非常に興味深い問題に遭遇しました。filter：alpha（opacity =）または-ms-filter cssプロパティをラッピングdivで使用する場合、内部ブロック要素のボックスモデルが破損します。つまり、垂直マージンの折りたたみが無効になり、代わりに垂直マージンが追加されます。私はIE9でのみこの問題に直面しています。IE7/8は影響を受けません。

これが、問題が分離されたjsFiddleです。トリガーアンカーを使用して、ラッピングdivのfilter：alphaを含むクラスをアクティブにします。（IE9のみ）

なぜこれが起こっているのか考えはありますか？

前もって感謝します

4

2 に答える 2

1

どのフィルターもこれを行うようです（jsfiddle.net/7BFd7）。

私はそれがなぜそうするのかについてしか仮説を立てることができませんでした。フィルタを使用すると、マージンの折りたたみを行わない未知の表示モードまたは位置モード（位置絶対、インラインブロック、フロートまたはクリアされた要素など）を使用するように要素が設定されるようです。

とにかく..その要素を非表示にしたい場合は、を使用できますvisibility: hidden。これは、と同じ効果がopacity: 0あり、どこでもサポートされています。

不透明度をアニメーション化する場合は、条件付きコメントまたはNormalizrを介してブラウザーのスニッフィングを実行しopacity、IE9でアニメーション化して、古いIEバージョンでフィルターを適用する必要があります。

于 2012-09-18T08:27:57.563 に答える
0

CSSだけでIE9のファイラーを「設定解除」し、IE8以下で適用できるようにする方法のひとつは、IE9のみを対象とする次のコードです。

.css-selector {
    filter:value;
    opacity:value;
}
@media all and (min-width:0) { /* the min-width query hides below IE9 */ 
    .css-selector { 
        filter:none; 
    } 
}

このようにして、不透明度：値のみを使用し、IE9でその要素をフィルター処理しないようにします。

于 2014-04-01T23:14:40.863 に答える