Calc of max, or max of calc in CSS

Question

Is it possible to do something like this

max-width: calc(max(500px, 100% - 80px))

or

max-width: max(500px, calc(100% - 80px         


        

Answer 1

min(), max(), and clamp() are finally available!

Starting in Firefox 75, Chrome 79, and Safari 11.1 (except clamp).

min() and max() take any number of arguments.

clamp() has syntax clamp(MIN, VAL, MAX) and is equivalent to max(MIN, min(VAL, MAX)).

min() and max() may be nested. They can be used in calc() as well as outside of it, they also may contain math expressions, that means you can avoid calc() when using them.

Therefore the original example can be written as:

max-width: max(500px, 100% - 80px);