DEV Community

Discussion on: What CSS tip do you want to share with others?

Collapse
 
robertotonino profile image
Roberto Tonino

Hi @adrianmarkperea !

I think you should def check the clamp() function, so you don't need to use min(max({MIN_SIZE}, 4vw), {MAX_SIZE}) but just clamp({MIN_SIZE}, 4vw, {MAX_SIZE}) 😉


h1 {
    /* font-size: clamp(MIN_SIZE, 4vw, MAX_SIZE)}; */
    font-size: clamp(2rem, 4vw, 4rem);
}
h1 {
    /* font-size: min(max({MIN_SIZE}, 4vw), {MAX_SIZE}); */
    font-size: min(max(2rem, 4vw), 4rem);
}

It has the same browser support, too.
MDN Reference