New CSS Units! Container Query Units explained

While media queries that look at the viewport size can be useful, today’s web is very component-based, and having to rely on the viewport size is pretty limiting. Luckily, container queries are now a thing! 🔗 Links ✅ Browser support for container queries: https://caniuse.com/?search=container... ✅ New media query syntax support (look for range syntax in the chart): https://developer.mozilla.org/en-US/d... ⌚ Timestamps 00:00 - Introduction 00:43 - The very basics 05:53 - A more real-world example 10:08 - The range syntax 11:13 - Named containers 14:37 - Container-type: size 17:46 - Container queries with flexbox and grid #css -- Come hang out with other dev's in my Discord Community 💬   / discord   Keep up to date with everything I'm up to ✉ https://www.kevinpowell.co/newsletter Come hang out with me live every Monday on Twitch! 📺   / kevinpowellcss   --- Help support my channel 👨‍🎓 Get a course: https://www.kevinpowell.co/courses 👕 Buy a shirt: https://teespring.com/stores/making-t... 💖 Support me on Patreon:   / kevinpowell   --- My editor: VS Code - https://code.visualstudio.com/ --- I'm on some other places on the internet too! If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter. Twitter:   / kevinjpowell   Codepen: https://codepen.io/kevinpowell/ Github: https://github.com/kevin-powell --- And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!