CSS has had such a renaissance in the past few years, and especially during 2023. We wish you a happy holiday season and hope you get a chance to incorporate some of these brilliant new CSS and UI features into your work soon!

Auto-sizes just shipped behind the Experimental Web Platform Features flag in Chrome Canary. Which makes this a good time to try to explain the one weird thing about it. In short: in addition to requiring loading=lazy, sizes=auto also basically requires that <img> elements have width and height attributes.

There is one old, yet unsolved, CSS problem: shrinking containers to fit the content when it automatically wraps. While not intentional, anchor positioning allows us to come closer to solving it, at least for a few cases. In this article, I’ll demonstrate how we can use anchor positioning to neatly decorate wrapping text or elements in flex or grid contexts.

The overflow CSS property (shorthand for overflow-x and overflow-y) controls what happens when the stuff you put inside a box is bigger than the box itself. Should it bleed out of the box (overflow: visible, the default)? Hidden completely (overflow: hidden)? Or should the content be scrollable (overflow: scroll or overflow: auto)?

I don't hate JavaScript, I love it. I write bucketloads of it every single day. But I also love CSS, and I even love HTML. The reason I love all three of these technologies is something called: The rule of least power. It's one of the core principles of web development and it means that you should choose the least powerful language suitable for a given purpose.