Caution

お使いのブラウザはJavaScriptが実行できない状態になっております。
当サイトはWebプログラミングの情報サイトの為、
JavaScriptが実行できない環境では正しいコンテンツが提供出来ません。
JavaScriptが実行可能な状態でご閲覧頂くようお願い申し上げます。

CSSプロパティ辞典

min-height

要素の最小となる高さを指定できます。

サンプルコード

div.test { min-height: 500px;}
div.test1 { min-height: 0;}

指定可能な値一覧

値	概要
数値	数値で指定します。主に使用される単位は『px』や『%』です。負の値の指定はできません。『%』で指定した場合の基準となる大きさは包含ブロックの高さとなります。初期値は『0』です。

ブラウザでの表示結果

<div style="min-height: 100px; background-color: #ff0;">ここはdiv要素です。『min-height: 100px』と指定しています。</div>

<div style="height: 300px; border: solid 1px #f00;">
	<div style="min-height: 80%; height: 200px; background-color: #ff0;">ここはdiv要素の中のdiv要素です。親のdiv要素(赤枠の要素)に『height: 300px』と指定し、この要素(背景色黄色の要素)には『min-height: 80%』、『height: 200px』と指定しています。この要素の最小の高さは親要素の高さに対する相対値となるため『240px』となり、『height: 200px』よりも大きな値となるため、この要素の高さは『240px』となります。</div>
</div>

対応ブラウザ

IE6	IE7	IE8	IE9	IE10	IE11	Safari	Chrome	Firefox	Opera

iPhone Safari	Android2系標準ブラウザ	Android4系標準ブラウザ

記事の間違いや著作権の侵害等ございましたらお手数ですがこちらまでご連絡頂ければ幸いです。

トップページへ