min-height:100%で、ウィンドウ高さいっぱいのレイアウトにする場合、親要素にheight:100%、 その子要素にmin-height:100%、というセットにする。 孫要素のmin-height:100%は効かない。 子要素にmin-height:100%とheight:100%の両方指定も無理。 IE6は、子要素でheight:100%を指定する。(*htmlで別指定など。)
min-height:100%で、ウィンドウ高さいっぱいのレイアウトにする場合、親要素にheight:100%、 その子要素にmin-height:100%、というセットにする。 孫要素のmin-height:100%は効かない。 子要素にmin-height:100%とheight:100%の両方指定も無理。 IE6は、子要素でheight:100%を指定する。(*htmlで別指定など。)
公開2015.08.07 更新2017.12.03 仕事・技術 IE11でmin-height:100%を設定しているのに正常に画面高に合わせてくれない場合の解決法です。 まず結論としては以下のような設定をすればmin-heightプロパティが正常化します。 親要素の高さもきちんと画面高の設定になっていて(height:100%;など)、上記コードを対象の要素に設定してあげればOKです。 ポイントとしてはmin-heightの「100vh」というところ。 この「vh」とは「viewport height」の略で、従来の%単位と似ているのですが、%と違い「デバイスの画面」を基準にしています。 これをmin-heightに設定した後にheight:100%;を設定することで、画面高に合わせたレイアウトを作成することができました。
Webページ内に配置したボックスなどのブロック要素で 要素の長さを画面目いっぱいの高さに伸ばそうとしたとしても CSSで「height:100%;」と指定しただけでは理想通りにいかなかったりします。 CSSでボックスなどのブロック要素を画面目いっぱいの高さにする際の記述方法を いざという時に忘れてしまいがちなので、今さらながら紹介がてらメモしておきます。 まずはサンプルから。 高さ100%のブロック要素サンプル HTMLソース上では 単純な<div>のボックス要素を配置します。 ◆HTML <body> <div id="container"></div> </body> そして、この「#container」の高さを 画面目いっぱいにするにはCSSで以下の様な記述をします。 ◆CSS html,body { height: 100%; } body { font-size: 100%; l
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く