CSS

WARNING!
Below you are about to see some CSS tips, tricks, hacks – some clever, some stupid. These are not guaranteed to work in every browser, nor do I care if they do. You’ll probably want to look at these in a webkit browser such as Chrome, Safari, Android, or Amazon Silk. I’ll apologize for how these look in Internet Explorer, if you apologize for using it to begin with.

by

A snake eating its tale, with the letters CSS printed on its face

Reading Time: 14 minutesEvery once in a while someone asks specifically about how to manage CSS performance for a website. What if there’s a lot of components? What if there’s a lot of animations? What if there’s a lot of just CSS?

by

Every language has different rules for where to set the hyphens, if they even have hyphens at all! English, Dutch, Cherokee, Spanish, and Cree are all different

Reading Time: 6 minutesThere’s a newish CSS feature called hyphens that specifies how you want words to be hyphenated when the text wraps.

But if you use it, you’re going to need to make sure you’re also correctly identifying the language. And to understand why that matters, we need to talk about words and syllables.

by

Reading Time: 3 minutesSo the :nth-child structural pseudo class is mighty handy already since it lets you select based on mathematical rules. But to my surprise, it got handier and no one told me. Which makes me think no one told you, either: :nth-child() can do filtering now!

by

Reading Time: 24 minutesThis is a blog post I’ve been meaning to write for like two years but haven’t, because it is a complex topic that’s a kind of modern-day Ouroboros where you don’t really know where to start but at no point do you think, “Everything’s fine; nothing could go wrong.” This is about how a feature

by

The hardest part about CSS actually isn't calculating specificity. It's saying 'specificity'.

Reading Time: 8 minutesThere’s a seldom-discussed concept in web software development called cyclomatic complexity which is a metric used to indicate how complex a program or unit of code is. It’s not discussed very often because, well, it’s really not exciting. You can get VS Code plugins that will measure the cyclomatic complexity and they can be somewhat

by

Screenshot of CSS with some snark

Reading Time: 3 minutesCSS continues to offer new ways to select things in ways we never could’ve imagined in the past (especially for an old timer like me). Today I want to focus on a possible (but not always probable) use-case: I have exactly n elements in a container. How can I do something only when all elements

by

Reading Time: 3 minutesSo a good while back I released this CSS utility / NPM Package called typography-baseline. It was a handy way to kickstart complex web projects because it set base typographic styles. Then I needed something for tables. And then I needed something for forms, too. So, well, you guessed it. Now there are three baselines.

by

Reading Time: 3 minutesSo a while back I released this CSS tool / NPM Package called typography-baseline.css. It was a pretty handy way to kickstart projects because it set some baseline styles to all my typography. More recently, I’ve come into some situations where I thought, “gee, it’d be nice if I had some starter for tables, too.”

by

Reading Time: 3 minutesI have a very handy, very small CSS Snippet that I use to debug CSS whenever the browser starts starts misbehaving. I figure I’d share with you, in case you, too, needed such a snippet.

by

Reading Time: 8 minutes
Folks who are brand new to web development, particularly front-end, might hear the term “Specificity” or “CSS Specificity” and when they look it up the answer can seem daunting and confusing.

I want to break it down in very simple, very non-technical terms so that someone brand-new to the world of front-end can understand what it is