Getting StartED with CSS by David Powers is published by “friends of ED” / Apress. It was first published in late 2009. As the title implies, this is a book for CSS newbies or casual CSS coders who want to deepen their knowledge.
The timing of this book is spot on. Microsoft has finally produced a reasonably CSS-capable browser in the form of IE8, and IE6’s usage is starting to dwindle. Now is a great time to learn CSS 2.1 in depth, and discover what it can really do.
This book thoroughly explains pretty much all the features of CSS 2.1, and also touches on some of the features of the upcoming CSS 3.
Here’s my full review of the book.
Content
Despite being called “Getting StartED with CSS”, the book actually gives a fairly thorough treatment of the topic, suitable for beginners and seasoned coders alike. I’ve worked with CSS for a number of years and I still learned new things from reading the book, such as the subtleties of display: inline-block
, the nuances of laying out and styling HTML tables, and the @page
rule for setting print margins.
The book also has lots of great tricks of the trade — for example, making sure your percentage values add up to a bit less than 100% to allow for browser rounding errors. (I’ve used this trick many a time.)
The book treats each CSS topic fairly thoroughly, and covers everything from basic font styling through to generated content. Despite this, the book is easy to follow and you rarely feel like you’re getting out of your depth.
Style
The author has an approachable writing style that is easy to read, although I found some of the chapter titles a bit ambiguous, such as “How Do I Solve the Mysteries of Width and Height?” and “How Do I Create Differently Styled Sections?”. Using questions for the chapter titles is also rather odd and contrived.
Unlike many books covering Web technologies, this book is relatively free of typos and other errors, which makes it a pleasure to read and helps you to trust the content.
The screen shots in the book are generally clear and helpful. There’s one unfortunate situation in Chapter 8 where the author uses red and green images that are otherwise identical — since the screen shots are in black and white the images look the same.
One thing that is slightly annoying is the use of “ED” in capital letters at the ends of some words in the titles. As well as the “StartED” in the book title, the tip-boxes in the book have headings such as “AdvancED”, “ExplainED” and “LinkED”. I appreciate this is part of the “house style”, but I still found it mildly annoying. Of course, this quirk doesn’t detract from the quality of the content at all.
Structure
The book is structured so that easy topics are introduced first, with more advanced topics appearing toward the end of the book. On the whole, this is a good thing, especially for a beginner book. It makes it easy for beginners to dive in without being overwhelmed from the start.
However it does create some odd situations, such as IDs and classes being explained in the floats chapter, the display
property being explained in the chapter on lists, and padding being introduced a whole 3 chapters after margins first make an appearance. This can sometimes make it difficult to use the book as a reference.
Overall, though, the book is reasonably well structured, and I can usually find what I’m looking for by scanning the table of contents. The index is also useful and reasonably complete.
Chapter-by-chapter breakdown
Here’s a brief description and review of each chapter of the book:
- 1: What Is CSS, and Why Should I Learn It?
- Gives a brief history of CSS and explains why now is a good time to learn CSS. Also explains why CSS is useful, shows how and where to write CSS rules, and explains the “cascade” concept. It also offers good advice for writing high-quality CSS, such as avoiding common mistakes and testing early and often.
- 2: How Do I Improve the Look of Text and Links?
- Covers the CSS font, colour, and text properties, and looks at styling links with pseudo-classes and the
text-decoration
property. Along the way it explains the concept of shorthand properties (usingfont
as an example) and gives a thorough treatment of the various length units (em
,px
,pt
and so on) and when to use them. - 3: How Can I Improve the Layout of My Text?
- Introduces the CSS box model and discusses
div
s andspan
s, margins, and centering text. It also offers useful tips on managing and organizing your style rules. (The chapter title is a bit of a misnomer, since margins and centring can apply to any element, not just text.) - 4: How Can I Flow Text Around Images?
- Introduces CSS floats, specifically with respect to images, and looks at various scenarios involving floating images. Also shows how to clear floats. Along the way the chapter introduces classes and IDs, and does a good job of explaining when (and when not) to use them.
- 5: How Do I Add Backgrounds and Borders to Improve the Look of My Page?
- Whew, what a long chapter title! This chapter thoroughly explores 2 more parts of the box model: background images/colours, and borders. It also offers useful tips for dealing with the interaction between borders, backgrounds and margins; removing borders from images; and preventing backgrounds and borders from appearing under floats.
- The detailed explanations and examples in this chapter are really helpful.
- 6: How Do I Solve the Mysteries of Width and Height?
- This chapter explores how the “real” width and height of an element are often different from the declared width and height, due to padding, margins and borders. This “box model” concept is often a confusing area for CSS beginners, and the chapter does a good job of clearing things up. It also explains how padding works, and how to choose between margins and padding. Other properties explored include
min/max-width/height
,overflow
, andvisibility
. - 7: How Do I Create Differently Styled Sections?
- This “hands-on” chapter takes a single-column page and shows how to add a sidebar to make a 2-column layout. It also shows how to use IDs to select and style different sections within the page, and how to create accessible headings.The chapter looks at various issues that occur with 2-column layouts and floats, including IE6 bugs and how to work around them. I found a couple of the approaches to be a tad kludgey, but overall it’s a solid introduction to multi-column layouts.
The end of the chapter explores all the various CSS 2.1 selectors in depth, and explains the concept of specificity.
- 8: How Do I Style Lists and Navigation Menus?
- As you’d imagine, this chapter deals with styling unordered, ordered, and definition lists. It also shows how to turn plain lists into attractive vertical and horizontal navigation menus, using CSS sprites to achieve rollover effects.The chapter ends with a discussion of generated content (using
content
,:before
,:after
, and so on). While it’s a bit strange to see this in a chapter on lists, I guess there is some connection between the two topics. - 9: How Do I Style Tables?
- Covers styling HTML tables using CSS. The chapter starts with a good explanation of how browsers lay out tables and looks at some less-used (but very useful) table-related elements:
colgroup
,thead
,tfoot
,tbody
, andcaption
. Then the chapter tackles table-related CSS properties, such asborder-collapse
,border-spacing
andtable-layout
, and shows how to use CSS to add borders, style columns and rows, add cell spacing and padding, lock down column widths, and more.The chapter ends with a very nice practical example that shows how to style a weather chart. - 10: How Do I Position Elements Precisely on the Page?
- Explores CSS positioning, covering all the values of the position property (
absolute
,relative
,fixed
, andstatic
). The author wisely points out that while absolute positioning sounds like a designer’s dream on the surface, in practice it’s of limited use for whole-page layouts. Instead the chapter concentrates on small but useful applications of CSS positioning. - 11: Are There Any Guidelines for Basic Page Layout?
- This chapter brings together many of the concepts learned in previous chapters by showing how to create complete layouts in CSS.It kicks off with some general hints and tips on page sizes and fixed vs. liquid vs. elastic layouts, then shows how to create a variety of 1, 2, and 3-column layouts using different CSS techniques (including Zoe Gillenwater’s excellent liquid faux columns). The chapter also touches on the possibility of using
display: table-cell
and related values for creating multi-column layouts.This chapter is a great primer for those wishing to build CSS page layouts from scratch.
- 12: How Do I Create Styles for Printing?
- The last chapter in the book shows how to create style sheets suitable for printing out Web pages. It shows how to use the
media
attribute to create additional or alternate CSS rules to be used when printing, discusses various print-related properties, and walks through a complete example page.Rather strangely, the chapter finishes by squeezing in some unrelated CSS properties that didn’t fit elsewhere in the book, such ascursor
andquotes
. - Appendix: CSS Properties and Selectors
- The useful appendix lists and describes every single property and selector available in CSS 2.1. Handily, it also points out when a property or selector isn’t supported by a certain browser (*cough* IE6 *cough*).
Summary
CSS, like so many Web technologies, is a rapidly moving target. However, David Powers has done an admirable job of writing a useful, up-to-date guide for beginner CSS coders. The book is easy to read and follow, and has plenty of clear examples to explain the concepts.
While the book has the occasional weak spot — most notably, the rather odd grouping of a few topics — overall this is a high quality book that will help CSS beginners get up to speed quickly and easily. I’d certainly recommend it to anyone who wants to learn what CSS is all about.
Leave a Reply