ホームページ > 記事 > ウェブフロントエンド > IE8 標準モードで「margin: 0 auto;」要素が中央に配置されないのはなぜですか?どうすれば修正できますか?
IE8 標準モードで「margin: 0 auto;」要素が中央に配置されないのはなぜですか?どうすれば修正できますか?
- Linda Hamiltonオリジナル
- 2024-11-26 05:29:09694ブラウズ
HTML ドキュメント型宣言と「margin: 0 auto;」の動作Internet Explorer 8 の場合
Internet Explorer 8 で Web サイトをテストしているときに、「margin: 0 auto;」という問題が発生する可能性があります。プロパティが期待どおりに要素を中央に配置しません。これは、次の HTML コードの場合に特に顕著です:
<div>
このコードは、Firefox 3、Opera、Safari、Chrome、IE7、IE8 互換モードを含むほとんどのブラウザでボタンを正しく中央に配置しますが、 IE8 標準モードではこれが失敗します。
この動作を理解するには、HTML ドキュメント タイプの役割を理解することが不可欠です。宣言。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
などのドキュメント タイプ宣言をドキュメントの先頭に追加すると、問題に対処し、IE8 標準モードでボタンを正しく中央に配置できます。これは、文書型宣言で使用されている HTML のバージョンを指定し、ブラウザが正しい標準に従ってコードを解釈できるようにするためです。
「margin: 0 auto;」の動作に関しては、一般に、ブラウザは要素の「表示」プロパティに基づいて異なる方法でこれを処理します。内訳は次のとおりです:
-
「display: block」が設定されている場合:
要素の幅は明示的に定義されていないため、「margin: 0 auto」になります。 ;"プロパティは、親コンテナ内で要素を水平方向に中央に配置します。 -
「display: inline」が設定されている場合:
要素にはブロックレベルの幅がなく、「margin: 0 自動;"プロパティは効果がありません。
以上がIE8 標準モードで「margin: 0 auto;」要素が中央に配置されないのはなぜですか?どうすれば修正できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。