John's Essential Guide to CSS

Posted by John on February 13th, 2007

I once taught a workshop on CSS and in the process compiled a list of essential reading for people interested learning CSS. I’ve revamped the list below adding a few additional articles and reorganizing it a bit. Most of the articles are from A List Apart, but the volume of articles at A List Apart can can be overwhelming to people just to getting started. Consider this a pocket guide to the best of A List Apart with a few additional links thrown in to spice it up a bit.

The Basics

• Fix Your Site with the Right DOCTYPE
• CSS Design: Font Size Matters
• Practical CSS Layout Tips, Tricks, & Techniques
• NYPL Online Style Guide
• Better Living Through XHTML

The Power of Floats and Backgrounds

• Faux Columns
• Creating Liquid Layouts with Negative Margins
• Two Column Tableless Layout
• CSS Design: Creating Custom Corners & Borders
• Mountain Top Corners
• CSS Drop Shadows (1, 2, and 3)

Print Stylesheets & Cross-Browser Compatibility

• CSS Design: Going to Print
• Print It Your Way
• Alternative Style: Working With Alternate Style Sheets
• Flash of Unstyled Content
• The IE Doubled Float-Margin Bug
• The Trouble With EM ’n EN
• The Box Model Hack
• Position Is Everything has fixes to bugs in IE, Opera, and Firefox

Lists, Rollovers, & Image Replacement Techniques

• Taming Lists
• Icon Styled Headings
• Spruced-Up Site Maps
• Suckerfish Dropdowns
• Using Background-Image to Replace Text
• Facts and Opinion About Fahrner Image Replacement
• In Defense of Fahrner Image Replacement

Secrets of Absolute Positioning

• Making Absolute Relative
• Absolutely Relative
• Flexible Layouts with CSS Positioning

Additional Resources

• CSS Cheat Sheet
• CSS Zen Garden
• Box Lessons
• Retooling Slashdot with Web Standards
• Separation: The Web Designer’s Dilemma
• Separation Anxiety: The Myth of the Separation of Style from Content