Uploaded May 2022 | Updated September 2026, 2 hours ago
Find out how can :has() parent selector help you simplify your code and avoid JavaScript entirely on practical, real-life examples.
You'll learn how to use :has() pseudo-class to enhance form validation, draw attention to an element, and tweak overall page styling based on a specific state of an input element.
🔥 Start Using color-scheme CSS Property: youtu.be/nQzRTsjBXfQ 🔥
🎨 Codepen Demos
Form Validation: codepen.io/ZoranJambor/pen/oNEgEdb/3b2b0bdd78c3acaaacda0ce3a0b64184
Highlighting Elements: codepen.io/ZoranJambor/pen/OJQPwVZ/3991985b8e24ba70a20eadbe538850b6
Page-Wide Tweaks: codepen.io/ZoranJambor/pen/bGLNQVx/689b86a4ee34c036fa2030b6afd321cb
📚 Resources
Animated Grid Tracks with :has() by Michelle Barker — css-irl.info/animated-grid-tracks-with-has
CSS Parent Selector by Ahmad Shadeed — ishadeed.com/article/css-has-parent-selector
MDN Entry on :has() — developer.mozilla.org/en-US/docs/Web/CSS/:has
📖 Chapters
00:00 Intro
00:30 Enhancing form validation
03:53 Highlighting elements
06:40 Page-wide tweaks
09:34 Conclusion
Subscribe to CSS Weekly Newsletter:
💌 css-weekly.com
Keep up-to-date with CSS Weekly:
👉 Twitter: twitter.com/CSSWeekly
👉 Instagram: instagram.com/cssweekly
👉 Facebook: facebook.com/CSSWeekly
Keep up to date with what I'm up to:
🔗 Blog: zoranjambor.com
👉 Twitter: twitter.com/zoranjambor
👉 LinkedIn: linkedin.com/in/zoranjambor
- Zoran Jambor
#css
Find out how can :has() parent selector help you simplify your code and avoid JavaScript entirely on practical, real-life examples.
You'll learn how to use :has() pseudo-class to enhance form validation, draw attention to an element, and tweak overall page styling based on a specific state of an input element.
🔥 Start Using color-scheme CSS Property: youtu.be/nQzRTsjBXfQ 🔥
🎨 Codepen Demos
Form Validation: codepen.io/ZoranJambor/pen/oNEgEdb/3b2b0bdd78c3acaaacda0ce3a0b64184
Highlighting Elements: codepen.io/ZoranJambor/pen/OJQPwVZ/3991985b8e24ba70a20eadbe538850b6
Page-Wide Tweaks: codepen.io/ZoranJambor/pen/bGLNQVx/689b86a4ee34c036fa2030b6afd321cb
📚 Resources
Animated Grid Tracks with :has() by Michelle Barker — css-irl.info/animated-grid-tracks-with-has
CSS Parent Selector by Ahmad Shadeed — ishadeed.com/article/css-has-parent-selector
MDN Entry on :has() — developer.mozilla.org/en-US/docs/Web/CSS/:has
📖 Chapters
00:00 Intro
00:30 Enhancing form validation
03:53 Highlighting elements
06:40 Page-wide tweaks
09:34 Conclusion
Subscribe to CSS Weekly Newsletter:
💌 css-weekly.com
Keep up-to-date with CSS Weekly:
👉 Twitter: twitter.com/CSSWeekly
👉 Instagram: instagram.com/cssweekly
👉 Facebook: facebook.com/CSSWeekly
Keep up to date with what I'm up to:
🔗 Blog: zoranjambor.com
👉 Twitter: twitter.com/zoranjambor
👉 LinkedIn: linkedin.com/in/zoranjambor
- Zoran Jambor
#css
