Internet Explorer 7 の「display: inline-block」問題を解決するにはどうすればよいですか?

Internet Explorer 7 のインライン ブロック エニグマへの対処

レイアウトを操作する場合、ブラウザ間の互換性によって課題が生じることがよくあります。このような苦境の 1 つは、display: inline-block プロパティです。このプロパティは、最新のブラウザーでは十分にサポートされていますが、Internet Explorer 7 の領域では問題を引き起こします。

特に、IE7 は、inline の解釈において奇妙な動作を示します。非インライン要素の場合は -block。このハードルを克服するには、次の CSS ハックを使用できます。

display: inline-block;
*display: inline;
zoom: 1;

この手法は、IE7 を効果的にだましてインライン ブロック機能を認識させます。スター プロパティ ハック (*display: inline;) は、特に IE7 をターゲットにしていますが、zoom: 1; hasLayout 動作をトリガーし、インライン ブロック エミュレーションの有効性を高めます。

このハッキングにより CSS 検証が無効になり、スタイルシートが中断される可能性があるため、IE7 専用のスタイルシート内に実装することを検討してください。条件付きコメントは、この目的のための洗練されたソリューションを提供します。

<!---[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]-->

このアプローチを利用すると、IE7 の表示: インライン ブロックの難問に効果的に取り組み、Web プロジェクトのブラウザ間の互換性を確保できます。

以上がInternet Explorer 7 の「display: inline-block」問題を解決するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。