What exactly is :root selector in CSS?

Published: 21 June 2023
on channel: CSS Weekly
7,062
217

A brief guide outlining how :root pseudo-class in CSS works, where it's often used and why, along with potential pitfalls.

🔗 Links
CodePen Demo: https://codepen.io/ZoranJambor/pen/Jj...
Custom Properties on :root Issue: https://github.com/w3c/csswg-drafts/i...
::selection background not visible issue: https://github.com/eslint/eslint.org/...

📖 Timestamps
00:00 What is :root pseudo-class
01:06 How :root in SVG works
03:21 Tip: Don’t define all your variables on :root
04:23 Pitfalls with :root inheritance
05:09 Should you use :root in your CSS?

Subscribe to CSS Weekly Newsletter:
💌 https://css-weekly.com/

Course Mastering Prettier & Stylelint
🔥 Learn everything about best linting tools while supporting CSS Weekly: https://masteringlinting.com/
🏷️ Use coupon code YOUTUBE15 to get an additional 15% off on the already discounted, pre-launch price.

Keep up-to-date with CSS Weekly:
👉 Twitter:   / cssweekly  
👉 Instagram:   / cssweekly  
👉 Facebook:   / cssweekly  

Keep up to date with what I'm up to:
🔗 Blog: https://zoranjambor.com
👉 Twitter:   / zoranjambor  
👉 LinkedIn:   / zoranjambor  

Zoran Jambor
#css #cssselectors


On this page of the site you can watch the video online What exactly is :root selector in CSS? with a duration of hours minute second in good quality, which was uploaded by the user CSS Weekly 21 June 2023, share the link with friends and acquaintances, this video has already been watched 7,062 times on youtube and it was liked by 217 viewers. Enjoy your viewing!