People Share Their CSS “Ah-ha!” Moments

Published
June 4, 2008
by
Chris Coyier

A few weeks ago I shared my CSS "Ah-ha!" Moment and asked others to share theirs. It was lots of fun hearing what those moments were for people. I wasn't surprised to hear the CSS Zen Garden come up very often, as that was a huge eye-opener for me and countless others I'm sure. I was surprised to hear how many people specifically brought up floats. I'm thinking about doing an in-depth article on that, since I don't think I ever have.

"...realizing you could style the contents of a box differently to the rest of the page" - Rob Lang

"Must have been in 2002 or 2003, I think. I saw the power of CSS and it's awesome possibilities in the CSS Zen Garden." - Oliver

"My CSS 'Ah-Ha!', as simple as it might sound, came from understanding that the BROWSER applies IT'S style first and so any CSS you are applying will essentially override those rules" - David Huntley

My first ‘Ah-ha’ moment was when I discovered (back in 2001) that CSS was the way to go to separate a site’s content/semantics from it’s presentation. I built my first site with Golive and I just couldn’t believe my eyes when I looked at the bloated & inefficient code it produced.

My second enlightment was – as for many others I believe- the Zen Gardens: their beautiful and inspiring examples proved it actually could be done with CSS. I’m more of a programmer then a designer, but I’ve learned quite a lot there.

And while we’re at it: thanks Chris for all your time and effort to make this site a worthwhile place to visit frequently.

My CSS “Ah-ha” moment came when I downloaded a simple guest book for my sidebar. I noticed it had a nice background color (which I knew how to do at the time), what introduced me to css was .box { border: 1px solid #FFFFFF } I needed to know desperately what was making the border.

This comment thread is closed. If you have important information to share, you can always contact me.

Treehouse is where you go to learn HTML, CSS, and how to build iOS apps. It's a complete education in modern web and app technology, designed to get you ready for a hot new job or to kickstart your own business.

The Lodge is a member login only area with access to video training on how to build websites from scratch using the best modern tools.

What now? I have some ideas for you.

Go explore CodePen!

As a front end designer and developer, you should have an account on CodePen so you can save your snippets, present your ideas, and engage with other front end folk. I'd encourage you to go PRO as well, to unlock the full power of CodePen.

Get the newsletter!

You should sign up for the CSS-Tricks newsletter. It's a clean copy of all the blog posts each week, combined together, right to your inbox. If email isn't your thing, there is an RSS feed, iTunes, and lots of other ways to subscribe.

Listen to ShopTalk!

Subscribe to The Lodge!

The Lodge is a members-only, ad-free video learning area here on CSS-Tricks. Just like the free screencasts, but organized into four large complete series. Membership is also the #1 best way to support CSS-Tricks.

We can do the real footer now.

Site Links

Colophon

CSS-Tricks* is created, written by, and maintained by Chris Coyier. It is built on WordPress, hosted by Media Temple, and the assets are served by MaxCDN. The fonts are Source Sans and Source Code Pro. It is made possible by viewers like you who subscribe to The Lodge and through advertising for products and services I like.