IE8 標準モードで「margin: 0 auto」要素の中心が異なるのはなぜですか?-CSSチュートリアル-php.cn

IE8 標準モードで「margin: 0 auto」要素の中心が異なるのはなぜですか?

DDD

リリース： 2024-12-05 03:35:11

オリジナル

438 人が閲覧しました

Why Does `margin: 0 auto` Center Elements Differently in IE8 Standard Mode?

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 サイトの他の関連記事を参照してください。