Internet Explorer 6 および 7 で「display: inline-block」のハックが必要なのはなぜですか?

クロスプラットフォーム互換性の問題: Internet Explorer 6 および 7 のインライン ブロック

表示: inline-block プロパティ。インラインをシミュレートするように設計されています。ブロック状の表示属性を持つ要素は、Internet Explorer バージョン 6 および 7 で互換性の問題に直面します。本来のインライン要素とは異なり、非インライン要素はdiv などの要素は、インライン ブロックの動作を実現するために特定の変更が必要です。

Internet Explorer 6 および 7 の解決策:

この互換性の問題を解決するには、追加の CSS が必要です。表示を補足します: 非インラインの inline-block プロパティelements:

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

• display: inline-block: 目的の表示動作を確立します。
• *display: inline: A IE7 以前を対象とした「安全な」CSS ハック
• zoom: 1: インラインブロックが一貫して動作するために必要な hasLayout を IE6/7 に提供します。

追加メモ:

• この回避策では有効な CSS が維持されます。特にベンダー固有のプレフィックスと組み合わせて使用​​する場合。
• display: inline-block とその複雑さの詳細については、関連ドキュメントを参照してください。

以上がInternet Explorer 6 および 7 で「display: inline-block」のハックが必要なのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。