CSS

The other day I needed to quickly see pixel dimensions that were exactly in a 9 / 16 aspect ratio. Like: 180 / 320. That’s perfectly in that ratio. You might be able to think of that one in your head, but how about 351 / 624? That’s harder to think of. And I wanted […]

Victor Ayomipo saw our post about using container units for everything. He was more optimistic than I that our result was good. My thinking is that there are plenty of things you straight up don’t want to use container units for. Victor did a similar exercise with (over?)-using min() and viewport units. Turns out there […]

When you use View Transitions on multiple elements, it can be a very nice look to stagger them out a little bit. It’s possible now, but a bit finicky. Let’s take a look at some code, present and future, that will help.

The ability to style a <select> menu has long been high on list of web designer’s want lists. The inside part anyway; the part that opens up when you activate it. The outside we’ve been able to style for a while. Open UI did a bunch of research and even had a browser implementation of […]

TODS: “an open source typography and opentype default stylesheet” from Richard Rutter. I like the idea of slightly-opinionated stylesheets that do a bunch of things you might forget to do, or just as likely, don’t know you can do to begin with. There are loads of goodies in here including a slew of utility classes for […]

Imagine transitioning a bunch of items all set into ONE cell of a grid, then each having a unique animation when they move from that cell into where they would naturally fall on that same grid.

A “fan out” animation involves sequentially revealing items from a stack with a bouncy effect. By using CSS grid, we save quite a bit of fiddly positioning work.

There is an entirely web-platform way of injecting scoped CSS styles into the DOM. It’s requires zero tooling. Will we see it being used more, once Firebox support is there?

Alvaro Montoro has a great thread (and blog post) of a bunch of CSS value functions in “the first public draft of the CSS Values and Units Level 5 Module”. It can’t be overstated how powerful some of this stuff is going to be. The attr() stuff enables much more a powerful realtime HTML<>CSS connection. […]

After the big shakeup with masonry layout recently (Apple: Make it part of display: grid;! / Google: Make it display: masonry;! / Me: I’ve got questions and I’d rather see tabbing order issues fixed first), I was very keen to hear where it would go. It took 5 months, but we’ve got movement. The CSS […]