この厄介なレンダリングの問題は IE9 でのみ発生します。IE8 と IE7 は、他のブラウザーと同様に正常に動作します。
IE9 でデモを開き、画像にカーソルを合わせます。問題は、IE9 では、画像の下にあるテキストがアーティファクトでレンダリングされることです。
IE9 を強制的に IE8 互換モードにすることでバグを解決できましたが、それでもこれが頭に残り、本当の解決策を探しています。
PS IE10 がインストールされていないので、バグもあるのだろうか...
この厄介なレンダリングの問題は IE9 でのみ発生します。IE8 と IE7 は、他のブラウザーと同様に正常に動作します。
IE9 でデモを開き、画像にカーソルを合わせます。問題は、IE9 では、画像の下にあるテキストがアーティファクトでレンダリングされることです。
IE9 を強制的に IE8 互換モードにすることでバグを解決できましたが、それでもこれが頭に残り、本当の解決策を探しています。
PS IE10 がインストールされていないので、バグもあるのだろうか...
このバグは、テキストをブロック レベルのタグでラップすることで解決できます。フィドルをそのように更新すると、バグはなくなります。
<html>
<head></head>
<body>
<div class="itemBtn"><img src="http://a3.mzstatic.com/us/r1000/029/Video/ad/b9/e4/mzi.sporozgs.100x100-75.jpg"><br> <p>IIII THIS IS SOME CRAZY TEXT</p></div></body>
</html>
<body> タグ内のテキストに関するルールはわかりませんが、ある時点でブロック レベルの要素に含まれている必要があると思います。おそらく、MS のバグというよりは、無効なマークアップのケースです。