CSS max() Function
Example
.example1 {
width: max(20%, 100px);
}
.example2 {
width: max(20%, 200px);
}
.example3 {
width: max(50%, 400px);
}
Meaning
The max() css function uses the largest (most positive) value from a list of comma-separated expressions as the value of a CSS property value.
It can combine min() and max() values, or use min() within a clamp() or calc() function.
It can accept more than two arguments, if you have multiple constraints to apply.
The expression can be values combining the addition ( + ), subtraction ( - ), multiplication ( * ) and division ( / ) operators, using standard operator precedence rules.
Version: CSS3
Standard Syntax
max(value1, value2, ...)
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
Status
Function Arguments
The following table describes the arguments of this function.
Argument | Description |
---|---|
value1, value2, ... | Specifies one or more comma-separated expressions as its parameter, with the largest (most positive) expression value used as the value of the property to which it is assigned. |