Weekly Bookmarks 9: CSS (as Usual)

Published on:

December 17, 2023

Categories:

CSS⁴⁰, bookmarks¹⁵

Current music:

Some Baldur’s Gate 3 battle music

Current drink:

Mulled wine from an alcohol-free Cabernet Sauvignon

I’m a bit tired after this week — I did speak about some of my CSS experiments at CSS Café on Thursday (later there’ll be a recording), so there are not as many links today, and, as usual, mostly only about CSS.

• “12 Days of Web” curated by Stephanie Eckles — I did already share a link to it in the previous “weekly”, but now there are already a few articles to check out! I highly recommend you to check them out and follow the new ones every day. I’ll list the ones from this week inside the <details>, as a way not to spoil the topics for you.

  This week’s 12 Days of Web’s articles (5 links)

  • “Popover API” by Ryan Trimble — an introduction to the Popover API.
  • “Anchor Positioning” article by me! Coincidentally, it was published on the same day I did the CSS Café talk.
  • “CSS @scope” by Miriam Suzanne — a post that lead to me finding an issue in the current Chromium’s @scope implementation, and me opening a PR to WPT for the case I found.
  • “Web Components” by Mayank — an introduction to web components. Next year, I predict, will be a lot about them. There’ll be a lot more talk about them!
  • “CSS animation-composition” by Tyler Gaw — an introduction to the animation-composition property. It is a very curious feature, which allows us to do some things not really possible otherwise. See also a follow-up Mastodon thread started by Christian Schaefer, with participation by Temani Afif and me, about the way the accumulate is calculated for the scale() transform.

• “CSS Scroll Snapping Aligned With Global Page Layout: A Full-Width Slider Case Study” by Brecht De Ruyte — an article about how we can use CSS variables and calculations to snap elements inside a slider that escapes the container to align the items inside with the content.

• “Carousel example” by Robert Flack — a prototype for the “CSS Overflow Extensions Explainer” by Miriam Suzanne, Robert, and Nicole Sullivan. It is an exploration of several interesting features that could help with creating sliders like in the above article. One of the explored parts of the proposal involving fragmentation is something I find very intriguing — I’m always for any advancements around fragmentation.

• “Using date-based CSS to make old web pages look old” by Terence Eden — an article about how we could use a rarely used type of attribute selector for hyphen-separated values, as well as the :has() pseudo-class to style pages based on their publication date, targetting the <time>’s datetime attribute.

• “A Mental Model for Styling the Shadow DOM” by Nathan Knowler — an article about one way we can think about the Shadow DOM styles, using the cascade for its purpose.

This week did also include an anniversary of my account on LiveJournal, and I wrote a short post about this: “My LiveJournal Anniversary”.