Printing music with CSS grid
Laying out sheet music with CSS grid—sounds extreme until you see it abstracted into a web component.
We need fluid and responsive music rendering for the web!
CSS Stats
A handy tool for getting an overview of your site’s CSS:
CSS Stats provides analytics and visualizations for your stylesheets. This information can be used to improve consistency in your design, track performance of your app, and diagnose complex areas before it snowballs out of control.
Related links
How would you build Wordle with just HTML and CSS? | Scott Jehl, Web Designer/Developer
This is a great thought exercise in progressive enhancement …that Scott then turns into a real exercise!
CSS :has() Interactive Guide
This isn’t just a great explanation of :has(), it’s an excellent way of understanding selectors in general. I love how the examples are interactive!
Retrofitting fluid typography | Clagnut by Richard Rutter
Here’s a taste of what Rich will be delivering at Patterns Day on Thursday—can’t wait!
Bill Oddie taught me how to make web sites - Hicks.design
I remember Jon telling me this lovely story when we first met in person. I love the idea that we had already met in a style sheet.
I also love the idea of hosting your own little internet archive—that Bill Oddie site still looks pretty great to me!
It’s a lot like an embarrassing family photo, but I’m owning it!
Related posts
Displaying HTML web components
You might want to use `display: contents` …maybe.
Progressive disclosure defaults
If you’re going to toggle the display of content with CSS, make sure the more complex selector does the hiding, not the showing.
Supporting logical properties
Using the CSS trinity of feature queries, logical properties, and unset.
Let’s get logical
Let me hear your blocky talk.
Control
Trying to understand a different mindset to mine.