Posts
React Pays the Bills

You should start a Mastodon instance

What happened to unit tests?

Client Side NPM

Adding Webmention Support to a Static Site

Preparing Your Site for Posting Notes

A Low-Friction Workflow for Short-form Posting on a Statically Generated Site

Teaching a Correct CSS Mental Model

Won’t You Be My Neighbor

Here we are again. Arguing about CSS, the cascade, and CSS-in-JS. And you know what? We’ll be here again in a few months. Because that seems to be the cycle.
Somebody tweets something, usually rather innocuous. This gets spun a few times with various reactions. Then it escalates.
So often conflicts arise from lack of communication, false assumptions, or confusion. Mr. Rogers
Getting started with Micropub
Resilient, Declarative, Contextual

I’ve spent a lot of time thinking about what defines a CSS mindset. Some people seem to “get” it, and others don’t. It’s always felt to me that if I could put my finger on that, maybe CSS would make more sense to those who have struggled with it. One piece of my motivation in writing CSS in Depth was to try to articulate some of those things.
HTML5 Sectioning and Landmark Elements

Introducing Sidecar
Meet the New Dialog Element

HTML 5.2 has introduced a new <dialog>
element for native modal dialog boxes. At first glance, it seems fairly straightforward (and it is), but as I’ve been playing around with it, I’ve found it has some nice features that might be easy to miss.
Shindig

My new site design is live! I’ve been working on this one for a while, and it just so happened to coincide with the #newwwyear activity on Twitter. I’m calling this theme Shindig.
OOCSS and Grid

OOCSS was the first of the many CSS methodologies. Since it arrived on the scene, the industry has moved on to newer, more strongly prescriptive methodologies like SMACSS, BEM, and ITCSS. These newer approaches dominate the conventional wisdom today. But CSS grid is here now, and I find it presents some challenges to this wisdom. I think it’s time we give OOCSS a little attention again, because it has an important idea to offer in the world of CSS grid.
Code, Not Clojure
I’m going to make two declarations that might sound contradictory:
- CSS is code.
- CSS is not a programming language.
Many developers get these backwards.
Transitioning Gradients
In, CSS, you can’t transition a background gradient. It sure would be nice if you could:
.gradient {
background-image: linear-gradient(
to right,
hsl(211, 100%, 50%),
hsl(179, 100%, 30%)
);
transition: background-image 0.5s linear;
}
.gradient:hover {
background-image: linear-gradient(
to bottom,
hsl(344, 100%, 50%),
hsl(31, 100%, 40%)
);
}
But, no. It jumps from one gradient to the other immediately, with no smooth transition between the two. So let’s hack it!
Thoughts on Self-Documenting CSS
One of the best programming books I’ve ever read is Clean Code by Robert C. Martin. If you have never read it, add it to your list.
Every comment represents a failure to make the code self explanatory. Robert C. Martin
Memorizing Alignment Properties
Do you often find yourself looking up a Flexbox cheat sheet? Wish you could just commit all those properties to memory and be done with it? Here’s how I memorized them.