From the course: Cutting-Edge CSS
Join today to access over 24,400 courses taught by industry experts.
How the clamp() function works - CSS Tutorial
From the course: Cutting-Edge CSS
How the clamp() function works
(upbeat music) - [Instructor] Responsive topography allows us to do fancy things like scale a font in relation to the size of the viewport. However, in most cases, we wanted to put upper and lower limits on the font size so the text doesn't get too small or too big. That's what the Clamp function does. Clamp takes three values, minimum, preferred and maximum, and the browser will try to apply the preferred value as long as the calculated size doesn't go below the minimum or above the maximum value. A typical use of clamp is to set the preferred value to some factor of the viewport width. That way, as the viewport gets wider, the font gets bigger. The minimum and maximum values literally clamp the font size so if the calculated preferred size goes below the minimum threshold, the size is fixed to that minimum threshold, and if it goes above the maximum threshold, it is also fixed to that maximum threshold.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.
