Issue #634
CSS Weekly (Zoran Jambor)Learn how to easily solve annoying problems using CSS, how to visually connect related elements using Anchor Positioning, what Too Early Breakpoints are, and more.
Headlines
Kevin Powell shares a few fantastic CSS tips that you’ll surely find useful.
Roland Franke provides a practical exploration of CSS Anchor Positioning and the anchor() function for visually connecting related elements without extra markup.
From Our Sponsor
Is your website slower than it should be? DebugBear provides in-depth web performance analytics based on synthetic tests and real user monitoring.
Detect pages with critical issues, get in-depth technical reports to identify solutions, and measure how performance impacts conversion rates.
Articles & Tutorials
The Too Early BreakpointAhmad Shadeed shares opinion on why you shouldn't switch to the smallest design too early.
Typographic scales and technical pens
Rob Weychert shows how to create a flexible system for consistent stroke widths across type sizes.
Performance-Optimized Video Embeds with Zero JavaScript
Stefan Bauer explores an approach of using a closed details element to prevent the embed from loading until that details element is opened.
What is JPEG XL and do we really need another image format?
Aaron T. Grogg explains what JPEG XL is, how it compares to other image formats like AVIF and WebP, and whether you should use it on your websites.
Live Region Support
Adrian Roselli outlines the best way to use live regions, covering how they are exposed to the audience who experiences them — screen reader users.
Sponsored Link
Did you know CSS has powerful features specifically for paged media? Running headers, page numbers, custom page sizes – it’s all at your fingertips! With EuroPDF, powered by the industry-leading PrinceXML rendering engine, you can easily take advantage of these features to create stunning PDFs.
Tools
ilamy CalendarA powerful, full-featured React calendar component library built with TypeScript, Tailwind CSS, and modern React patterns. Features multiple calendar views, drag-and-drop support, recurring events, and comprehensive internationalization.
X-Ray React
Xray-react is a development tool that reveals the component structure of your React UI.
Inspiration
Alvaro Montoro created a stunning collection of optical illusions with pure CSS. No JavaScript, no animations—just clever use of colors, patterns, and gradients to trick your brain.
Until Next Week
Thanks for reading! If you find the content valuable, please consider supporting the newsletter on Patreon.
Happy coding,
Generated by RSStT. The copyright belongs to the original author.