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!
What is Utility-First CSS?: HeydonWorks
Heydon does a very good job of explaining why throwing away the power of selectors makes no sense.
Utility-first detractors complain a lot about how verbose this is and, consequently, how ugly. And it is indeed. But you’d forgive it that if it actually solved a problem, which it doesn’t. It is unequivocally an inferior way of making things which are alike look alike, as you should. It is and can only be useful for reproducing inconsistent design, wherein all those repeated values would instead differ.
He’s also right on the nose in explaining why something as awful at Tailwind could get so popular:
But CSS isn’t new, it’s only good. And in this backwards, bullshit-optimized economy of garbage and nonsense, good isn’t bad enough.
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!
Can you feel the rhythm‽ · 13 March 2024
Adam makes a very good point here: the term “vertical rhythm” is quite chauvanistic, unconciously defaulting to top-to-bottom writing modes; the term “logical rhythm” is more universal (and scalable).
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!
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.
Assumption
Separate your concerns.
Culture and style
Styling a document about The Culture novels of Iain M Banks.
Supporting logical properties
Using the CSS trinity of feature queries, logical properties, and unset.
Let’s get logical
Let me hear your blocky talk.