Reputation:
What's the difference between minmax() and clamp() in CSS?
Both CSS functions clamp the value between an upper and lower bound.
The only difference that I know is that minmax() can only be used in CSS grid.
Upvotes: 3
Views: 5599
Answers (2)
Reputation: 1877
minmax() may only be used in Grid and picks between two (2) parameters.
clamp() can be used anywhere in CSS and picks between three (3) parameters: minimum, preferred, and maximum, selecting the middle (preferred) parameter when possible.
Upvotes: 8
Reputation: 5767
From developer.mozilla.org:
clamp()enables selecting a middle value within a range of values between a defined minimum and maximum. It takes three parameters: a minimum value, a preferred value, and a maximum allowed value.
minmax() only accepts the two extreme values, plus the difference that you already mentioned.
Upvotes: 2
Related Questions
- How does clamp() differ from setting width, max-width, & min-width?
- How max-content and min-content are evaluated for a row aside to a big grid-area in CSS grid?
- Why does minmax(0, 1fr) work for long elements while 1fr doesn't?
- What is the difference between min-content and max-content in a CSS Grid row?
- What happens when minmax is: minmax(auto, auto)
- minmax() in CSS grid layout
- minmax behaviour, flexible css grid
- minmax() defaulting to max
- How does `minmax` create more than one column when passed `1fr` in CSS Grid?
- Difference between simple(width and height) and max/min(width and height)?