ホームページ >ウェブフロントエンド >CSSチュートリアル >IE8 標準モードで「margin: 0 auto」要素の中心が異なるのはなぜですか?
IE8 標準モードで「margin: 0 auto」要素の中心が異なるのはなぜですか?
- DDDオリジナル
- 2024-12-05 03:35:11433ブラウズ
Internet Explorer 8 の Margin: 0 Auto の動作について
Internet Explorer 8 の margin: 0 auto プロパティの動作は次のとおりです。特に他のブラウザでの処理と比較した場合、混乱を招きます。これらの矛盾に対処するために、この記事ではブラウザー固有の動作を調査し、関連する仕様への参照を提供します。
margin: 0 auto を使用した中央ボタンの特定のケースでは、IE8 の動作は他のブラウザーとは異なります。次のコードはこれを示しています。
HTML:
<div>
Firefox、Opera、Safari、Chrome、IE7、および IE8 互換モードでは、ボタンは中央に配置されますが、IE8 標準モードでは、
この不一致を解決するには、次に示すように、HTML ドキュメントに DOCTYPE を追加することをお勧めします。以下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
この DOCTYPE を使用すると、IE8 標準モードでも margin: 0 auto を使用してボタンが正しく中央に配置されます。
提起された具体的な質問について:
-
表示: ブロックと要素幅:
- CSS2.1 仕様によれば、「display: block」の設定は要素の特定の幅を定義しません。
- ただし、ほとんどのブラウザは「」を解釈します。 「display: block」を使用して、幅を 100% または使用可能な幅に設定します。この動作は仕様では保証されていません。
-
Margin: 0 auto and Element Alignment:
- When "display : block」が設定されている場合、「margin: 0 auto」は次のように解釈されます。
- IE8 標準モードでは、入力ボタンなどのインライン レベルの要素の「margin: 0 auto」が考慮されません。これは、「margin: 0 auto」でブロックレベルの要素を中央に配置する必要があるという CSS2.1 仕様に矛盾します。
以上がIE8 標準モードで「margin: 0 auto」要素の中心が異なるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。