CSS Tips and Tricks: Responsive content without media queries using CSS Clamp()

There's a super useful CSS function called Clamp() you've got to learn as a part of your of bag of CSS Tips and Tricks.

It's better than using a width property because you can set up a minimum and maximum value, which are the clamps and that will help you use less media queries in your projects. Picture in your mind how you might use clamps when woodworking to limit the movement of something like your circular saw.

You can use it to limit all types of values wherever you use properties like length, frequency angles, etc. You can use measurements like percentages or any of the viewport measurements, so it's more flexible than just a hard value.

Notes: http://raybo.org/apply​ At MDN: https://go.raybo.org/3G1l Codepen: https://go.raybo.org/3G3H

#csstricks​ #csstips​ #css​ #cssclamp​ #webdesign​ #webdeveloper​ #cssnewfeatures​

00:00 - Introduction 00:08​ - What is CSS Clamp 00:24 - CSS Clamp on MDN 01:00​ - Your First Clamp 01:32 - Clamp in the Main Content Section 02:06 - Using Clamp for responsive font sizes 02:29 - Can I Use Info for Clamp() 02:54​ - Practice with CodePen ... https://www.youtube.com/watch?v=CICYdO0g8Ew