DEV Community

Discussion on: Write Fewer Media Queries With the Clamp() CSS Function

Collapse
 
dar5hak profile image
Darshak Parikh •

For older browsers, we could do something like:

h1 {
  font-size: 16px;
}

@supports (font-size: clamp(16px, 5vw, 34px)) {
  h1 {
    font-size: clamp(16px, 5vw, 34px);
  }
}
Enter fullscreen mode Exit fullscreen mode

This should at least work on older Safari. As for IE, well, it doesn't support @supports. :|

Collapse
 
vtrpldn profile image
Vitor Paladini •

Great suggestion, Darshak! I wish I could pin comments

Collapse
 
erickpetru profile image
Erick Eduardo Petrucelli •

Hey Vitor, you could edit the post adding this suggestion. Makes sense to increase support with little effort.

Thread Thread
 
vtrpldn profile image
Vitor Paladini •

Well, it's more a matter of graceful degradation than support increase but your idea is great, I'll do it right now!