min-width max-widthの値別のレンダリング

長さ

min-width　幅の最小値

max-width　幅の最大値

<div style="min-width:200px; max-width:500px; background:#def;">
こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは
</div>

同じソースを異なった大きさのフレームで表示しています。

min-width　幅の最小値

max-width　幅の最大値

<div style="min-width:50%; max-width:75%; background:#def;">
こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは
</div>

同じソースを異なった大きさのフレームで表示しています。

*1 min-widthの値に%値を用いるシチュエーションが思いつきません。

min-width　幅の最小値

max-width　幅の最大値

<div style="min-width:200px; max-width:none; background:#def;">
こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは　こんにちは
</div>

同じソースを異なった大きさのフレームで表示しています。