Using CSS3 Wisely

Now that you’ve seen how useful and beneficial CSS3 can be, can you just plop it into your style sheets and get going? Well, yes, but I wouldn’t recommend it without learning some best practices first. Just as with CSS 2.1, CSS3 has its own special considerations that should go into how you craft your style sheets to make them more organized, efficient, and future-proof. You also need to know how to implement CSS3 in a way that won’t harm non-supporting browsers, and how to provide workarounds for those browsers when you so choose.

Browser Prefixes

When a browser implements a new property, value, or selector that is not yet at Candidate Recommendation status, it adds a prefix onto the front of the property with a code for its rendering engine. For instance, -moz-border-radius is the version of the border-radius property currently used by Mozilla-based browsers, like Firefox. Table 1.4 provides a list of the available prefixes.