Kevin Powell·1yRemove empty elements with one line of CSS - great for dynamic content
Learn how to efficiently hide empty elements in dynamic content using the CSS empty pseudo-selector, avoiding the need for complex JavaScript solutions. Ensure that your error messages are completely empty to work correctly and consider accessibility implications for screen readers.
Kevin Powell·1yEasily create overlapping sections on a website
Learn multiple solutions for creating overlapping sections on a website layout, focusing on using CSS techniques such as box-shadow and linear gradients. The post also provides tips to avoid common issues and discusses the merits of each method.
Kevin Powell·1yThis CSS Color Game is way harder than I expected
Explore a fun and challenging CSS color guessing game where you need to match colors to their CSS names. The author describes their experiences and struggles with identifying specific color names like 'goldenrod', 'dark orchid', and 'ghost white'. They share their mistakes and learnings throughout the game, providing a link for readers to try it themselves.
Kevin Powell·1yMy best CSS tips from 2024
The post reviews five valuable CSS tips from 2024, focusing on timeless techniques that many developers overlook. Key highlights include customizing link underlines with thickness, color, and style properties, optimizing background images with repeat, round, and space properties, using nth-child to select ranges of elements, utilizing CSS counters for dynamic numbering, and solving text wrap issues on buttons using fit-content. These tips help enhance styling without relying on modern CSS features.
Kevin Powell·1yYou can scope styles with vanilla CSS now
Scoped styles in vanilla CSS allow developers to apply specific styles to elements without affecting others outside the designated scope. This technique uses the @scope rule to limit the style application, thereby preventing style bleeding and reducing specificity issues. It enables behaviors similar to those found in JavaScript frameworks, offering more precise control over component styling.