max()
The max() function resolves to the largest of one or more comma-separated values.
Syntax
max(<value>, <value>...)Examples
.panel {
padding: max(1rem, env(safe-area-inset-left));
min-height: max(50vh, 320px);
}
Output
Ensures padding clears the device safe area and the panel is never shorter than 320px.
Notes
max() acts as a minimum floor (it picks the larger, so the value never drops below the largest bound). Frequently combined with env() for safe-area insets and to enforce minimum tap targets.
Browser & runtime support
| Environment | Since version |
|---|---|
| chrome | 79 |
| firefox | 75 |
| safari | 11.1 |
| edge | 79 |