People Share Their CSS “Ah-ha!” Moments

Avatar of Chris Coyier
Chris Coyier on (Updated on )

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

“Mine was first time I installed Firebug …” – Francisco

“… the time I figured out … the difference between block and inline elements …” – survivor

“… cracking open html.css (the Firefox CSS file) and realizing how a browser works.” – Tim Wright

“… realizing that I could use images for any page element… ” – Bob

“When I finally truly figured out how to get my floats to do what I want in ALL browsers.” – Lindsey

“For me it was when I got my head around the Box Model.” – liam

“… something like ohhh THAT is what clear:both is for.” – V1

“My Ah-ha! moment was realizing that position:relative on a particular div will allow you position:absolute any element inside that div …” – gaga

“The realization of how floats really work. Suddenly, using tables for layout seemed so 90’s.” – Erik Brännström

“… the first time I discovered I didn’t have to use javascript OnMouseOver.” – Jay

“understanding that there is a “normal flow” – Serge

… figuring out how parent styles applied to children … – Heidi