html - div の高さを 100% に設定するには?

Question

Empty Div を作成します。ブラウザー画面のページ全体に div を表示する必要があるため、その空の Div の高さを 100% にしようとしていますが、高さを 100%にすることはできません。空の div の高さを 100% に設定する方法はありますか?

  <div id="test">
        <div id="test1">

        </div>
    </div>

Answer 1

親/divにも高さを指定する必要があります。つまり、

#test, #test1
{
  height: 100%;
}

フルスクリーンにしたい場合は、次のように使用する必要があります。

#test1, #test, body, html
{
    height: 100%;
}

お役に立てれば。

Answer 2

あなたはあなたのCSSで最小の高さを与えることによってそれを試すことができます

#test,#test1 {
min-height: 100%;

}

Answer 3

これにはjavascriptを使用することもできます

 var h = document.getElementById("mainContentID").offsetHeight;
 document.getElementById("menuID").style.height = h + "px";

1 行目では、新しい変数「h」を作成し、この変数に見つかった要素の高さを割り当てます。これは、CSS で指定されている「height:」を返すのではなく、画面に表示されるドキュメントの実際の高さを返します。

2 行目は、もう一方の短い要素の「height:」スタイル値を変数 h + 「px」で埋めます。</p>

このコードをドキュメントの末尾近く、おそらく body タグの直前に配置すると、ページが読み込まれたときにすぐに実行されます。これを jquery $(window).load または $(document).ready でラップすることもできます。ただし、そのままでは、ライブラリの依存関係はありません。単純な古い JavaScript だけです。

http://jsfiddle.net/BDEnM/を確認してください