| 形式 | clamp(min, value, max) |
|---|---|
| サポート | https://caniuse.com/?search=clamp |
value を返します。ただし、value が max より大きな時は max を、min より小さな時は min を返します。max(min, min(value, max))) と同じ意味を持ちます。
:root {
--min-width: 3rem;
--max-width: 10rem;
}
.box {
border: 1px solid #999;
width: clamp(var(--min-width), 6rem, var(--max-width));
}
<div class="box">AAA</div>