私はCSS3PIEを使用して、他のブラウザーのスタイルシートで取得するInternetExplorerの要素にいくつかの丸みを帯びた角を適用しています。しかし、私はそれに関していくつかの問題に遭遇しました。
IE8で、PIEの動作をする要素が奇妙に動作することを発見しました。コンテナは数ピクセル右にジャンプしますが、コンテンツは元の位置に留まり、コンテンツがすべてコンテナに対して左にシフトしたように見えます。これは、パディングがないか少量の要素で特に問題になります。
X-UA-Compatibleを使用することで、IE8の問題を回避することができましたが、可能な限りこの解決策は避けたいと思います。テストのためにIE9にアクセスすることはできませんが、PIEのようなハックを理解する必要はなく、互換モードを必要としないブラウザーで互換モードを強制するのは無駄です。
私はIE6でさらに悪い問題を抱えており、リスト項目を使用するように設定されたリストでPIEレイアウトが完全に壊れていdisplay:inline; zoom:1;
ます(IE8や他のブラウザーで機能するインラインブロックをシミュレートするため)。ここでは、リストアイテムの境界線が完全に間違った場所にレンダリングされます。
したがって、理想的には、互換モードに頼ることなく、IE6およびIE8でPIEを適切に機能させたいと考えています。IE6に関する限り、PIEが適用されていない場合の適切なフォールバックで十分です。IE7は、ページが意図したとおりに表示される唯一のブラウザーです。
残念ながら、現時点ではサンプルページを提供することはできませんが、後で追加することはできます。
ファローアップ:
IEテスターで作成されたスクリーングラブをいくつか示します。彼らが皆のために物事をもう少し明確にすることを願っています。ご覧のとおり、IE7は問題ありません。ただし、IE8では、コンテナーはコンテンツに対して左にオフセットされており、IE6ではリスト要素(丸みを帯びた1ピクセルの境界線)は完全に混乱しています。
フォローアップ2
こちらがデモページへのリンクです。
他のデザイナーがスタイルシートやデザインの他の部分に取り組んでいるので、それが非常に長い間完全に反射し続けることを約束することはできませんが、うまくいけば、問題を解決するのに十分長い間そうなるでしょう。(はい、IE6にJSエラーがあることは承知していますが、それは私の問題ではありません)。
サンプルページ