Web ページにインライン ブロック要素がいくつかあります。適用するのにうんざりしている
*display: inline;
zoom: 1;
これらのブロックを使用するすべての css セレクターをハックします。ページ上のすべての出現に対してそれを修正する便利な方法はありますか?
Web ページにインライン ブロック要素がいくつかあります。適用するのにうんざりしている
*display: inline;
zoom: 1;
これらのブロックを使用するすべての css セレクターをハックします。ページ上のすべての出現に対してそれを修正する便利な方法はありますか?
悲しいことに、あなたの質問に対する私の答えは「いいえ、これ以上の解決策はありません」です。IE7 をサポートする必要がある場合は、これらの点で妥協する必要があります。
スタイルシートをリファクタリングして目立たなくする方法はおそらくあります-別のファイルに隠すか、独自のクラスなどに配置します-しかし、妥協することになる可能性があります。見栄えが良くなるかもしれませんが、物事を簡単にするよりも、メンテナンスの労力が増える可能性があります。
そのソース コードを持たなくて済むようにする唯一の方法は、ファイルを公開するときに何らかのプリプロセッサを使用してスタイルシートに追加することです。IE7 をサポートする必要がある場合、これをオンにする必要から逃れることはできません。しかし、それで実際に問題が解消されるわけではなく、展開プロセスに余分な手順が追加されるため、理想的ではありません。
もう 1 つの選択肢は、他の人が行ったことを実行して IE7 のサポートを中止することだと思います。それはおそらく最も賢明な選択肢です。私はもう何年も IE7 をサポートしていません。このようなものが原因です。ああ、もう誰も実際に IE7 を使用していないという事実。
条件付きスタイルのハックを使用してみることができます。
IE6/7 ハックを含む別の css ファイルを作成し、!important
. 次に、通常の CSS をリンクした後、このファイルをページに含めます。
<!-- IE7-specific fixes -->
<!--[if lte IE 8]>
<style type="text/css"> @import url("./IE7Fix.css"); </style>
<![endif]-->
この方法では、メインの css に触れる必要がなく、id-selector または class-selector に応じてスタイルを一度だけ指定します。IE7 をサポートする必要がなくなったことを確認したら、この包含を削除できます。
それらすべてに一度に適用される 1 つの大きなセレクターを使用できます。
/* Inline-block fix for older versions of IE */
.foo,
.bar,
.baz,
.gallery > li {
*display: inline;
zoom:1;
}