FosterMilo builds websites for the real world.

Crisp. Clear. And User-Friendly.

Personal tools
You Are Here: Home Articles CSS for Ninjas

CSS for Ninjas

Alex Sielicki | September 14 2007

I've been writing CSS for years and haven't touched a table for layout in almost as long. But I still haven't reached that "CSS Ninja" level. I tend to get bogged down when the browser bugs get wicked, when the layout get complicated, or when my selectors start stepping on others' toes.

In steps CSS Mastery, a book meant to take skilled CSS crafters and turn them into CSS warriors.

After a quick refresher of the foundation, including a clear section on DOCTYPE switching, a nice explanation of specificity (Did you know it was not calculated in base 10, but rather an unspecified, high base number? Me neither.) and a box model recap, the book launches into 5 core chapters.

These focus on:

  • Effectively using images
  • Stying links
  • Creating navigation bars
  • Styling forms and tables (data tables, of course)
  • Page layouts

(Table of Contents PDF)

One of the strengths of this book is explaining multiple standard ways of achieving an effect. I counted 3 techniques for doing rounded corners and 4 for drop shadows. Each technique's strengths and weaknesses were clearly explained so the reader could apply them appropriately.

The last part of the book tackles nasties like hacks, filters, bugs, and browser inconsistencies. Filters are techniques for displaying or hiding CSS from certain browsers. For example, the star HTML filter lets you apply CSS only to IE6 and below. The following will set IE6's background to red, but leave FF and IE7 alone:

* html {
     background-color: red;
}

Other filters covered include Tantek's box model hack, band pass filters (also created by Tantek Çelik), the IE/Mac commented backslash hack. There's also a discussion of the common browser bugs (like the IE6 peek-a-boo bug), as well as a section on how best to do your bug hunting (Firefox's Web Developer extension, W3C's CSS Validator).

During frustrating stints of CSS testing, I've run into many of these bugs as well as the hacks posted by people online. I've always been reluctant to use the hacks because of incomplete explanations or praise that was obviously biased.

What I like most about CSS Mastery is the clear, objective explanations that it provides for a complete set of advanced CSS techniques.

© FosterMilo All Rights Reserved