css - doctype html を追加するとレイアウトの高さが壊れる

Question

私は最近ページを開発していましたが、すべてが適切に機能していることを確認した後<!doctype html>、上部にタグを追加していないことに気付きました。追加すると、レイアウトは高さを無視しました。

何が間違っていて、問題が解決しないかを確認するために、最も基本的なレイアウトに落とし込みました。私がやっていることは HTML5 と矛盾していますか?

score 14 · Accepted Answer

コードを投稿に追加する必要があります。そうしないと、投稿が閉じられます。また、ペーストビンではなく、実際に結果を確認できるように、codepen または jsfiddle の何かの方が適切に機能します。

これを CSS に追加します。

html, body {
  height: 100%;
  min-height: 100%; /* for firefox */
}

score 2 · Accepted Answer

タグの高さを設定する必要があります

body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
}

2 に答える 2