
Issue #542
Learn how Style and Container Queries work, how to create a CSS-only direction-aware hover effect using :has(), and more.


On Container Queries, Responsive Images, and JPEG-XL
Jason Grigsby explores how responsive images work with Container Queries.
From Our Sponsor

Bite-sized Lessons to Ramp Up on AI, Data, and More
Looking to level up your skills? Look no further than Brilliant. Brilliant offers a fun way to master math, data science, and computer science, without the boredom of traditional lectures or textbooks. With Brilliant’s interactive approach, users can easily learn even the most complex concepts and sharpen their skills in no time. So, whether you’re looking to boost your career or personal growth, Brilliant is the perfect tool to help you challenge yourself and get ahead of the game. With over 10M+ users already on board, there’s no better time to join and start your journey toward brilliance.
CSS Weekly on YouTube

Create a Direction Aware Hover Effect Using CSS :has() Selector
A practical guide on building a pure-CSS direction-aware hover effect for your navigation menu bar using :has() pseudo-class.
Articles & Tutorials
Simplified Dark Mode With Style Queries
Stephanie Eckles explains how style queries can help you simplify dark mode styles.
Everything You Need to Know About the Gap After the List Marker
Šime Vidas outlines the challenge of adding a gap after the ::marker pseudo-element.
Do we need CSS flex-wrap detection?
Ahmad Shadeed explains why we need flex-wrap detection and outlines some practical use cases.
Are you making these five mistakes when writing alt text?
Daniel Sage outlines some common mistakes when writing alt text.
Promoted Link

Don’t just read the news—make the news.
Get exclusive insights into tech and finance with The Information Pro. Their team of award-winning journalists provide in-depth reporting on the companies and decision makers that matter. With resources like org charts, databases, surveys, and a weekly wrap-up newsletter, you’ll stay informed and ahead of the curve. For a limited time, subscribe today and save 50%.
Tools
Scrollbar.app
Scrollbar.app is a simple web app that will help you design and implement custom scrollbars.
Inspiration
Until Next Week
Thank you so much for reading!
If you want to to get your hands on practical guides to CSS, check my YouTube Channel. I upload new guides weekly, and it would mean a lot if you give it a look.
Happy coding,
Zoran Jambor

Baseline Status for Video
A handy online tool that will let you easily show Baseline Status in your videos.



