Hiding empty elements with CSS :empty and :has()
A tutorial on using CSS :empty and :has() pseudo-classes to conditionally hide elements based on their content or child elements.
A tutorial on using CSS :empty and :has() pseudo-classes to conditionally hide elements based on their content or child elements.
Explains the key differences between CSS pseudo-classes (like :hover) and pseudo-elements (like ::before), including syntax and use cases.
Explains how the CSS pseudo-classes :hover, :focus, and :active behave with different input devices like mouse, keyboard, and touchscreen.
Explains the CSS :empty and :blank pseudo-selectors, their differences, and practical use cases for styling empty elements and creating empty states.
Explains the difference between CSS selectors nth-child() and nth-of-type(), including how they work and common pitfalls.
Explains the CSS :not pseudo-class and its surprising impact on selector specificity, with practical examples.
Explains the difference between CSS pseudo-classes and pseudo-elements, and clarifies the correct single vs. double colon syntax to use for each.
Explores five underused CSS selectors like :empty, ::first-letter, and :not(), with practical examples for web developers.
A tutorial on creating a Tic Tac Toe game using only CSS, with hidden checkboxes and pseudo-classes for game logic.
Explains CSS pseudo-classes, clarifying common misconceptions and detailing the difference between classes and pseudo-classes like :hover and :active.
Explains CSS pseudo-classes like :link, :visited, and :first-child, describing them as 'phantom' classes that style elements based on state.