IEのCSS3シャドーが丸まったdivコーナーを固め

Question

私のdivで丸い角だけを使用すると、IE9でどのように期待されているかが分かります。私は、ドロップシャドウを作るために以下の行を追加するとき

border-radius: 7px; 

はしかし、私は予想外の効果を得る：

filter: progid:DXImageTransform.Microsoft.Shadow(color='#818181', Direction=135, Strength=3); 

は、ここで効果のスクリーンショットです。私はそれを取り除くことができますどのように

http://imageshack.us/photo/my-images/406/blackcorners.png/

：私は突然私の水色のdivに追加醜い小さな黒い角に言及していますか？

Answer 1

IE9はネイティブにbox-shadowをサポートしていますので、古いfilterスタイルを使用する必要はありません。

古いIEのバージョンのためにfilterを使用している場合、両方のシャドウがIE9で再生されている可能性があります。その結果、奇妙な結果が発生します。

最初の提案は、filterスタイルを削除することです。これは、IEのバージョンではボックスの影が表示されないことを意味しますが、実際にはレイアウトの重要な要素ではありません。

これがうまくない場合は、CSS3Pieを使用して、古いバージョンのIEのボックスシャドウを実装することをお勧めします。ボーナスとして、border-radiusも実行します。

CSS3Pieでは、古いバージョンのIEでは標準のCSS box-shadowスタイルを使用でき、filterスタイルを心配する必要はありません。そして、それがあなたの質問に直接どのように答えるかを示すために、IE9では自動的に自動的に切れるので、ダブルシャドー効果は得られません。

希望に役立ちます。