CSS
A function that automatically adjusts an element's size between a minimum and maximum value.
minmax()
minmax()
は、CSS Gridで使われる関数で、「最小サイズと最大サイズの間で伸び縮みできる幅(または高さ)」を指定するために使います。
これは、画面サイズが変わってもレイアウトを無理なく調整できる便利な仕組みです。
たとえば次のように書きます:
grid-template-columns: minmax(200px, 1fr);
この指定は「この列は最低でも200px
あり、でも空きスペースがあればそれ以上広がってもいい」という意味になります。
よく使われる場面は次のとおりです:
- スマホやタブレットなど、画面幅が違う環境でもレイアウトを崩さない
- 最小幅を守りつつ、空きスペースをバランスよく使う
- 自動でリサイズされる柔軟なグリッドレイアウトを作る
要するに、「小さくなりすぎず、大きくなりすぎない」範囲で調整したいときの便利な道具です。