#cssWish to be able to do:

[type='radio|checkbox'] {}

instead of:

[type='radio'], [type='checkbox'] {}

#CSS #code #coding #frontend #web #dev #cssSelector #webDevelopment #webDev

🔵🟡🔴 CSS selectors
by @Frontendly
Uncover a new #CSSselector:
Short Video - A quick tutorial to learn the selector.
Quiz - A fun way to test what you learn.
By the end, you will have mastered 24 essential #CSS selectors, empowering your frontend journey!

https://css-selectors.dev/advent-calendar/2024

#tinyCSStip

Range input browser inconsistencies may mean needing different styles for different browsers. Possible for track & thumb via different pseudos, but what about the actual range input?

Well, `@​supports selector()` to the rescue!

Live test on @codepen

#CSS #HTML #cssSelector #code #frontend #webDev #web #dev #webDevelopment #coding

#cssGotcha `:has()` cannot be nested!

From the spec: `:has()` is not valid within `:has()`.

#CSS #gotcha #code #coding #frontend #webDev #dev #web #webDevelopment #cssSelector

#tinyCSStip

`:is()` is such a great new-ish #CSS feature that helps eliminate repetition in selectors ✨

#code #coding #frontend #cssSelector #web #dev #webDev #webDevelopment

🔴🟢 CSS :has() Interactive Guide
by Ahmad Shadeed @shadeed9
An extensive guide to CSS :has() selector.
#has #CSSselector #css #webdev

https://ishadeed.com/article/css-has-guide

🔵 What exactly is :root pseudo-element in CSS?
by @zoranjambor at @CSSWeekly
A brief guide outlining how :root pseudo-class in CSS works, where it's often used and why, along with potential pitfalls.
#css #CSSselector #root #webdev

https://youtu.be/lXUS5E4gqV0

🍋🥭 A CSS selector to highlight clickable elements
Sebastian De Deyne @sebdedeyne @sebdd
#cssSelector #highlight #webdev

https://sebastiandedeyne.com/a-css-selector-to-highlight-clickable-elements/