Ich stieß auf ein sehr interessantes Thema in IE9. Wenn Sie die Eigenschaft filter: alpha (opacity =) oder -ms-filter css auf einem Wrapping div verwenden, wird das Boxmodell der inneren Blockelemente beschädigt. Mit anderen Worten, das Kollabieren des vertikalen Randes wird deaktiviert und der vertikale Rand wird stattdessen hinzugefügt. Ich habe dieses Problem nur in IE9. IE7 / 8 ist nicht betroffen.
Hier ist ein jsFiddle mit dem isolierten Problem. Verwenden Sie den Trigger-Anker, um die Klasse zu aktivieren, die filter: alpha für das Wrapping div enthält. (Nur IE9)
Irgendwelche Ideen, warum das passiert?
Vielen Dank im Voraus
Jeder Filter scheint das zu tun ( jsfiddle.net/7BFd7 ).
Ich könnte nur die Hypothese aufstellen, warum das so ist. Es sieht so aus, als ob die Verwendung eines Filters das Element dazu benutzt, einen unbekannten Anzeige- oder Positionsmodus zu verwenden, der keine Ränder kollabiert (wie absolute Position, Inline-Blöcke und floated oder gelöschte Elemente).
egal ... Wenn Sie nur dieses Element ausblenden möchten, könnten Sie visibility: hidden verwenden, was den gleichen Effekt wie opacity: 0 hat und überall unterstützt wird.
Wenn Sie die Deckkraft animieren möchten, müssen Sie das Browser-Sniffing über bedingte Kommentare oder Normalizr durchführen und opacity in IE9 animieren und den Filter in älteren IE-Versionen anwenden.
Eine Möglichkeit, den Filer in IE9 mit nur CSS zu "aufheben", während er in IE8 und niedriger angewendet werden kann, ist der folgende Code, der nur auf IE9 abzielen würde:
%Vor%Auf diese Weise verwenden Sie dann nur opacity: value und filtern nicht nach diesem Element in IE9.
Tags und Links css internet-explorer-9 opacity