トップページの中の プロパティの中の Mのプロパティ一覧の中の min-width

min-width

  • 最終更新:2009年11月20日 01:06

min-widthプロパティは、ボックスの最小幅を指定します。

widthプロパティでwidth: 90%;などとし、横幅が可変するリキッドレイアウトを作成した場合に、min-widthプロパティと合わせて使うことでウィンドウサイズを極端に小さくした場合などのレイアウト破綻を防ぐ事ができます。

尚、IE6はmin-widthプロパティに対応していません。
対応させるには、JSを使ったりIE独自拡張のexpressionを使った方法やCSSだけで実現する方法など色々有るので、試してみて自分に合った方法を使うといいと思います。

対応ブラウザ
  • IE6未対応
  • IE7対応
  • IE8対応
  • Firefox3.5対応
  • Opera10対応
  • Safari4対応
  • Chrome3対応

プロパティの解説

<長さ>|<パーセント>|inherit
初期値
0
適用される要素
全ての要素
(非置換インライン要素及びテーブルの列・列グループ要素は除く)
継承
しません
パーセント値
包含ブロックの幅に対する割合
メディア
visual

値の解説

<長さ>
幅を長さの単位で指定します(300pxとか)。尚、マイナス値は不正です。
<パーセント>
包含ブロックの幅に対する割合を指定します。尚、マイナス値は不正です。

min-widthのサンプル

div#contents {
  width: 90%;
  min-width: 300px;
}
<div id="contents">
<p>コンテンツが入ります</p>
</div>

このページの上部へ