ホームページ > 記事 > ウェブフロントエンド > Firefox と IE で DIV の高さが 100% にならないのはなぜですか?
このシナリオでは、Firefox と IE の間で DIV 要素のレンダリングに不一致が発生しました。具体的には、含まれる DIV 内で高さを 100% に設定しても、IE ではネストされた DIV が最大の高さに拡張されません。
この不一致は、Quirks モードと Standard モードの動作から発生します。
コードでは、包含ブロック (#container) の高さが「auto」に設定されており、標準モードでは高さが未定義になります。その結果、ネストされた DIV の高さも未定義になります。
この問題に対処し、ブラウザ間で一貫性を確保するには、含まれるブロックとその祖先のルート (HTML と本文) までの高さを明示的に定義する必要があります。 elements):
html, body { height: 100%; } #container { height: 100%; }
これらの要素の高さを設定すると、明確に定義された包含ブロックが確立され、ネストされた DIV がその高さを継承し、すべてのブラウザのコンテナ内で 100% に拡張できるようになります。
以上がFirefox と IE で DIV の高さが 100% にならないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。