要素の横幅の最大値と最小値を指定する

min-width/max-width

解説

要素の幅やボックスの幅をブラウザの画面に合わせて表示させるには、「width」プロパティにおいて、値をパーセントなどの相対的な数値で指定すれば可能です。

こうすれば、ブラウザの表示幅に依存しないレイアウトにできます。

しかし、画面を極端に狭くして閲覧すると、レイアウトにも限界が生じ、レイアウトが崩れることもあります。

また、逆に幅を極端に広くして見た場合には幅が広がりすぎて見にくくなってしまうこともあります。

解決法

これを解決するために、要素の幅の可動範囲を予め指定しておくことができます。

これを実現するのが「min-width、max-width」プロパティです。

これらのプロパティにおいて、要素の幅の最小値と最大値を指定します。

指定方法

「width」プロパティと同様に、サイズ（数値）やパーセントによる指定が可能です。

ただし、厳格な最小値と最大値を定めるための値ですので、一般的にはポイントなどの絶対的な数値で定めておくのが普通です。

ちなみに、最大値の初期値の「none」は上限なしという意味です。

IEには未対応

現在のところ、このプロパティはInternetExplorer5.0/5.5/6.0には対応していません。