「min-width」プロパティ

幅・高さ

「min-width」プロパティは、要素の最小の幅を指定するCSSプロパティです。
枠線（境界線）やパディング領域の内側にある、「table」「td」「th」「img」「input」「textarea」「select」などのコンテンツ領域の幅を設定できます。
「min-width」プロパティは、要素がこれ以上は大きくならない最小値を指定することができます。

本記事の内容

「min-width」プロパティの値
「min-width」プロパティの指定方法

「min-width」プロパティの値

要素の最小の幅を指定する単位は「px」「%」「em」「rem」「vw」「vh」などの値を指定することができます。
※ブラウザの種類により、小数点以下の数値は切り上げされる場合がありますので小数点での指定は推奨できません。
※要素には、インライン要素とブロックレベル要素があり、インライン要素では、横幅の指定ができません。

「min-width」プロパティの指定方法

要素の最小の幅を指定する場合は、「min-width」プロパティを使い適応する値を指定することで実装できます。

「min-width」プロパティ

セレクタ{
max-width:要素の最小の幅;
}

値例

/* px値 */
min-width: 100px;
min-width: 200px;
min-width: 300px;

/* %値 */
min-width: 80%;
min-width: 90%;
min-width: 100%;

/* em値 */
min-width: 20em;
min-width: 30em;
min-width: 40em;

/* rem値 */
min-width: 20rem;
min-width: 30rem;
min-width: 40rem;

/* vw値 */
min-width: 20vw;
min-width: 30vw;
min-width: 40vw;

/* vw値 */
min-width: 20vh;
min-width: 30vh;
min-width: 40vh;