Debug panel

Close debug panel
Roma’s Unpolished Posts

My 2024 in CSS

Published on:
Categories:
CSS 63, Personal 17
Current music:
MASS OF THE FERMENTING DREGS — Aoi, Koi, Daidaiiro No Hi
Current drink:
Sencha tea

Intro

This was another productive year for me. After 2023, when I explored anchor positioning, scroll-driven animations, and came up with “Cyclic Dependency Space Toggles”, I was afraid that I couldn’t get anywhere close. After all, innovation is hard, and you never know if you will stumble over something exciting.

Looking back at 2024, I can safely say that I managed to continue doing what I was doing. And, as it will be obvious from the next sections, there were things that would be difficult to top.

Joining the CSS Working Group

For someone who built their entire career by focusing on CSS, getting an email titled “Would you like to be a CSS WG Invited Expert?” at the beginning of February was surreal, and equally gratifying.

Obviously, I accepted. A bit later, in June, the company I am working in — Datadog — joined W3C, so now I’m a regular member of CSS Working Group.

I try to participate in every meeting I can, although I am not sure if I manage to contribute much. Being among people who write CSS specs and implement them in browsers is a good opportunity to keep the impostor syndrome that I had my whole life going strong.

A photo showing a group of people walking from left to right on a hill overlooking a city on a peninsula, with blue water, rolling green hills and slightly cloudy sky.

In June, I traveled to A Coruña for a few days of face-to-face meetings and met many people I previously only talked to or followed virtually. I still need to publish the photos that I took there, oops.

Speaking at CSS Day 2024

Another thing that happened at the beginning of 2024 was getting an invitation to speak at CSS Day conference, and then speaking at it in June.

I’ve yet to watch my talk, but I am planning to eventually do it, as I want to do a text version of it. I have no idea how it went other than that I almost fell from the stage, haha.

All other talks from this conference, were, as usual, great — I can highly recommend you to watch them!

My Articles and Techniques

While 2023 was for me mostly a year of playing with experimental features, I spent most of 2024 thinking about custom properties, ways we can do APIs with them, and many related topics like conditional CSS and mixins. Most of it stemmed from my “Cyclic Dependency Space Toggles” from 2023: both the first and the last articles I published are a continuation of them.

  • “Layered Toggles: Optional CSS Mixins”

    April 9. Probably the weakest article from this year, but about an important topic — I published it as soon as I discovered the technique. While the usage of revert-layer for optional styles was not new, using it in combination with space and cyclic toggles is a much more powerful concept, which I will depend on in the future.

  • “Alternating Style Queries”

    April 16. An article about a simple but powerful trick with style container queries. Once they become available in all browsers (Firefox, I’m looking at you), I expect this technique to be very common. Initially, it was meant to be a part of the next article I published, but I saw how it is more important to separate it from the more gimmicky and complicated parts.

  • “Self-Modifying Variables: the inherit() Workaround”

    April 18. The article that flew under the radar the most, even though the effect it talks about is very useful and powerful and is not possible to achieve in any other way. Looking at how we can work around the things that will eventually be in CSS was a theme for me this year, and the inherit () function is something I wish browsers started to prototype. The workaround based on alternating style queries from the previous article is tricky, but once we have style container queries, I expect it to be an important and invaluable tool.

  • “Fit-to-Width Text: A New Technique”

    July 19. The most popular article from any that I ever published. The solution for fit-to-width text was something of a holy grail in CSS, and I still can’t believe I found a key to it — and that it is fully cross-browser. It is imperfect as it requires duplication of content, but I don’t think we will come anywhere closer with pure CSS. Let’s hope this will one day be possible with native CSS!

  • “Possible Future CSS: Tree-Counting Functions and Random Values”

    October 22. The article that took the longest to finish. But it also has the best interactive examples! It does not really introduce new techniques, but it combines many concepts that I did not see used together before. I can’t wait for the native CSS in question to be available, but, for now, I am planning to use the workarounds described in this article in my other experiments.

  • “Indirect Cyclic Conditions: Prototyping Parametrized CSS Mixins”

    December 24. The article is about a technique that is a culmination of many different things. In some way, it was another holy grail that I pursued for a long time, and I’m thrilled that I managed to get to the solution. Yes, we will eventually have native conditions, functions, and mixins, but what I unveiled in this article will allow us to close the gap and experiment with these concepts today. And, hopefully, it could also push browsers to start prototyping sooner rather than later.

Some of My Blog Posts

While I did manage to write a blog post every day for the whole of November again, I did not manage to do it consistently in other months. At some point, I got overwhelmed with the bookmarks backlog and will need to work on some kind of solution (I still want to share them more often — and first read them, as I never share things that I did not read).

I did also post a few noteworthy CSS-related posts here. Some of them were almost good enough to be articles on the main site, but I explicitly wanted them to be a bit less polished. I wanted to work on my blog’s engine (mostly Astro), so I needed to have some posts with live code examples.

Here are the posts that, if you missed, I recommend to check out:

My Browser Bug Reports

Almost every time I work on an article or post, I encounter some bugs. I am not always diligent in reporting them, but I try to do it when I have the spoons for this. This year, I matched the number of bugs I reported in 2023: a total of 27 across all browsers then and now.

I think I have a few unreported bugs here and there in my notes and drafts; I’ll try to be even more diligent in 2025.

Plans for 2025

Speaking of notes and drafts. While I don’t have any specific plans for the next year, what I have is a pile of drafts and experiments on various stages.

While there is nothing groundbreaking among them, there are some things that I find curious enough to be content with what I could publish in 2025. I do not intend — and can’t imagine — topping this past year. After all, you can’t force discoveries — only work towards them.

Please share your thoughts about this on Mastodon!