# minmax() 함수

## 사용법 <a href="#usage" id="usage"></a>

`minmax()` 함수를 사용하면 최솟값, 최댓값 범위 내에서 값을 유연하게 처리합니다.

**예시**

```css
.grid-container {
  display: grid;
  /* minmax() 함수 사용법 */
  grid-template-rows: repeat(2, minmax(20px, auto));
  grid-template-columns: minmax(30px, auto) repeat(3, 1fr);
}
```

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH6wK_UI-H3yt6X74Xs%2F-LH75RUc6qe82Fnn-xbG%2Fimage.png?alt=media\&token=fa70ae9c-f16c-47c3-9a66-20f651ad2117)

## 레퍼런스 <a href="#reference" id="reference"></a>

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH6wK_UI-H3yt6X74Xs%2F-LH75VWChIc7Hbngw4SH%2Fimage.png?alt=media\&token=1e62375e-69d3-40f1-a123-d22a778c95f6)

{% embed url="<https://www.w3.org/TR/css-grid-1/#valdef-grid-template-columns-minmax>" %}
w3.org/TR/css-grid-1/#valdef-grid-template-columns-minmax
{% endembed %}