First, let me make a gratuituous plug for the product that made my education on the subject of CSS possible: O'Reilly's Safari Bookshelf. If you haven't tried it yet, be sure to drop by their site and look at the staggering library. It works like this: they have the full contents of 1,300 books from all the major computer publishers like Microsoft Press, O'Reilly and Pearson Technology Group which publishes under the banner of Addison Wesley, New Riders, Cisco Press, Que, Alpha, Adobe Press and Sams. You can do complex subject searches on topics, read sections from dozens of books that cover the topic and when you are ready add a book to your personal library. Once you add a book to your personal library, you have access to everything -- text, graphics, links to the author's web site (usually with updates and examples for the book) and you can bookmark important sections to come back to later. You pay an annual fee for the service based upon how many books you can have in your personal library at one time. This way the authors and publishers receive royalties for the books you "purchase." Books have to stay in your library for a minimum of one month.
I don't think online books are better if you want to read from cover-to-cover, but they certainly are if you want to use them for reference to track down problems and learn specific topics. For about $110, I was able to study far more efficiently than if I headed to the bookstore every time I was stumped -- and I'd have had to purchase far more than three books, which is about what $110 will get you in computer books these days. The following books all came via O'Reilly Safari.
Most of us used to layout web pages in tables. No longer. CSS provides far more elegant and useful forms than tables ever did. Please do yourself a favor. Head out to The Zen Garden and see what happens when hundreds of designers are forbidden to modify the html file at all, but are free to change the css any way they want. To keep clicking on the menu "Select a Design" (watch out, it's in a new location every time) to view more examples. Unless you read carefully, you'll never believe all the designs have exactly the same content. CSS moves things around, adds graphics, colors, etc. -- in short, everything you need to format a web page. More than anything else, playing with that site convinced me of the necessity of switching to all-css coding.
Undoubtedly the easiest place to get started with creating boxes for your website is to grab one from The Noodle Incident. He has box designs sketched out, you select the one you want and presto, here comes the css. To get started, this place is a must. It's also a good read, so go up the site to grab more goodies. Definitely worth spending time.
W3C Markup Validator (Beta) Test your code here. It is much better than the older one because the errors have some real explanations of what's wrong.
Code Examples Simple site. Click on a lesson and see some excellent, short examples and explanations of code snippets.
The Layout Reservoir More box layouts. Steal some. They do nice work.
css/edge Erik Meyer's personal site. Great stuff, great beauty and wonderful ideas. His ComplexSpiral demo may be the most beautiful web site I've seen. Doesn't render well in Internet Explorer, but looks great in Mozilla. Really stupendous site and he tells you exactly how he does it.
A List Apart Probably the strongest voice in support of css out there. Nearly everyone references something from ALA. Must read. Don't let the simple opening menu throw you. There are hundreds of wonderful articles buried in here. I've never read a bad one.
Brain Jar Detailed analysis of boxes and formatting, plus lots of other stuff.
Glish.comDetailed articles on css. Spend time here.
Web Standards Project (WaSP) Detailed information on css and standards. Don't start here, but you may want to finish here.
Nemesis Project A jillion tutorials. Some excellent, some OK. But most topics are covered.
Web Reference Yet more articles on a whole host of topics related to css. Mostly good-to-excellent.
DocType Switching This site will show you how the various browsers will treat your DocType declaration. When you need it, you really need it.
Note: Some of this information is included in the bibliography in the tutorial. This is the updated version.
© 2003 by Toby Scott
Contact the webmaster with your comments.
Check Validity