CSS Functions

CSS Functions

clamp()

clamps a value between an upper and lower bound
font-size: clamp(min, range, max); font-size: clamp(1rem, 1vw + 1rem, 2rem);

Means-
Minimmum font size will be 1 rem
Max Font size will be 2 rem
Range β€”β€Š1vw + 1rem
if Range value gets calculated less than min value(here 1rem) then 1 rem will be set as font size
if Range value gets calculated more than max value(here 2rem) then 2 rem will be set as font size
if Range value gets calculated between max value(here 2rem) and min value (here 1rem) then in that case whatever range value is calculated will be applied.

Max()
width: max(40%,300px)
it means min-width:300px and width:40%

Max()
width: min(40%,300px)
it means max-width:300px and width:40%

Happy learning πŸ‘πŸ‘

Β