Naming things just got easier thanks to @scope

From the creator

🎓 Check out CSS Demystified: https://cssdemystified.com/?utm_campaign=general&utm_source=youtube&utm_medium=scope @scope is here, and it's pretty awesome! This video is a bit of crash course into it, looking at why it can come in handy, where it fits into the cascade, some of the potential issues you can run into when using it, and more. 🔗 Links ✅ Bramus’ great article on scope: https://developer.chrome.com/docs/css-ui/at-scope ✅ Browser support table: https://caniuse.com/css-cascade-scope ⌚ Timestamps 00:00 - Introduction 00:43 - Why you might want scope in the first place 03:40 - Avoiding this issue using @scope 06:50 - Why this solves the problem - scope proximity 09:05 - Specificity still matters 10:28 - CSS Demystified 11:08 - Stop running into specificity issues thanks to scope 13:30 - Stop the scope at a specific element or elements 16:25 - You can have selector lists if you need to target several elements 17:16 - The difference between & and :scope 20:52 - Things will still inherit! 22:24 - Using inline style blocks 24:45 - Browser support #css -- Come hang out with other dev's in my Discord Community 💬 https://discord.gg/nTYCvrK 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! 📺 https://www.twitch.tv/kevinpowellcss --- Help support my channel 👨‍🎓 Get a course: https://www.kevinpowell.co/courses 👕 Buy a shirt: https://teespring.com/stores/making-the-internet-awesome 💖 Suppor

Published 2024-06-20 · Watch on YouTube ↗
Availability and playback restrictions are controlled by the original channel.