Skip to main content
CSS is fun and cool and I like it.

Articles

C'mon in. Make yourself at home. Stay a while. Other things welcoming people say. Just starting out? Check out our beginner's guide.

5937 Articles
{
,

}
Article

How I’ve Improved as a Web Developer (and a Person) in 2019

Avatar of Preethi
Author
Preethi
Comments
Start the Conversation

We’re sliding into the roaring twenties of the twenty-first century (cue Jazz music 🎷). It’s important that you and I, as responsible people, follow the tradition of looking back on the past year and reflect on the things that went right and wrong in the hopes of becoming the best version of ourselves in the year ahead.

I never do New Year’s resolutions, except for when I was ten years old and wanted to open a local self-run detective agency … Read article

Link

Freak Flags

Avatar of Chris Coyier
Shared by
Chris Coyier

I don't see image sprites used that much anymore, but it's still a good technique for reducing downloaded decorative image assets when you have multiple on a page. The big idea is combining all the graphics into one and then shifting around the size and background-position to reveal one at a time.

Say you're site needs dozens or hundreds of country flags — that's a perfect opportunity for a sprite. Michael P. Cohen has built a generator site to help … Read article

Our Notes   /   Read at www.freakflagsprite.com
Article

Just Sharing My Gulpfile

Avatar of Chris Coyier
Author
Chris Coyier
7 Comments
Join the Conversation

Seemingly out of the blue, the Gulp processing I had set up for this site started to have a race condition. I'd run my watch command, change some CSS, and the processing would sometimes leave behind some extra files that were meant to be cleaned up during the processing. Like the cleanup tasks happened before the files landed in the file system (or something... I never really got to the bottom of it).

Nevermind about the specifics of that bug. … Read article

Link

Making a Better Custom Select Element

Avatar of Chris Coyier
Shared by
Chris Coyier

We just covered The Current State of Styling Selects in 2019, but we didn't get nearly as far and fancy as Julie Grundy gets here. There is a decent chunk of JavaScript that powers it, so I'm still very much eyeballing browsers' recent interest in giving us more powerful selects in (presumably) just HTML and CSS.

I tossed a fork on CodePen in case you just wanna see the final result.

See the Pen
Custom Select Input by … Read article

Our Notes   /   Read at 24ways.org
Sponsored Link

WordPress.com: One CMS, Infinite Possibilities

Have you ever looked at a site and knew exactly what CMS powers it? You might see a distinctive design aesthetic that gives it away. Or maybe it's something even less obvious and even harder to articulate, but you know it when you see it.

That seems true with just about any platform, especially those that rely on a set of templates. If you were to jump from one site ot another on the same platform, you can see the … Read article

Our Notes   /   Read at wordpress.com
Article

Quoting in HTML: Quotations, Citations, and Blockquotes

Avatar of John Rhea
Author
John Rhea
6 Comments
Join the Conversation

It’s all too common to see the incorrect HTML used for quotes in markup. In this article, let’s dig into all this, looking at different situations and different HTML tags to handle those situations.

There are three major HTML elements involved in quotations:

  • <blockquote></blockquote>
  • <q></q>
  • <cite></cite>

Let’s take a look.… Read article

Link

How Facebook Avoids Ad Blockers

Avatar of Chris Coyier
Shared by
Chris Coyier

Dylan Paulus:

Facebook actually hides 'dummy' DOM nodes between the 'Sponsored' text. These values are entirely random characters, with a random number of DOM nodes between them. Invisible characters. At this point our CSS ad blocker is completely broken. There is no way for us to possibly code every possible value in CSS.

We've covered this before when Mike Pan noted it. Looks like it's evolved a bit since then, getting even a little tricker.

I just opened my … Read article

Our Notes   /   Read at www.dylanpaulus.com
Link

Music and Web Design

Avatar of Chris Coyier
Shared by
Chris Coyier

Brad has a long history in music outside of being a web designer, and draws some interesting parallels. One is that he had reached for more complex music in an effort to become a better musician — and developers can do the same thing. The other is that the composition of music can be seen from very large parts down to very tiny parts, just like atomic design.

I have two go-to connections between music and web design … Read article

Our Notes   /   Read at bradfrost.com
Article

A Handy Sass-Powered Tool for Making Balanced Color Palettes

Avatar of Stephanie Eckles
Author
Stephanie Eckles
Comments
Start the Conversation

For those who may not come from a design background, selecting a color palette is often based on personal preferences. Choosing colors might be done with an online color tool, sampling from an image, "borrowing" from favorite brands, or just sort of randomly picking from a color wheel until a palette "just feels right."

Our goal is to better understand what makes a palette "feel right" by exploring key color attributes with Sass color functions. By the end, you will … Read article

Link

Motion Paths – Past, Present and Future

Avatar of Chris Coyier
Shared by
Chris Coyier

Cassie Evans has a great intro to motion paths. That is, being able to animate an element along a path. Not just up/down/left/right, but whatever curvy/wiggly/weird path you want.

It's an interesting subject because there are so many different technologies helping to do it over time. SMIL, JavaScript-powered animation libraries, native JavaScript APIs, and even CSS via offset-path and friends. I think offset-path is funny - it was changed to that name from motion-path as you don't technically have… Read article

Our Notes   /   Read at tympanus.net