Book review: Sams Teach Yourself CSS in 10 Minutes

Recently, I picked up this book because I’ve wanted to learn CSS but haven’t found any online tutorials to my liking. It bills itself as being for a beginner to intermediate level and is geared for people who want a simple guide for quickly learning CSS. Going into this experience, I would say I knew enough HTML to consider myself an intermediate user.  I decided to work my way through the book in sequential order and build my own pages from scratch rather than use the examples provided on the web.  After finishing, these are my impressions of the book:

  1. I had a rocky time getting started, partially because the “Hello World” of setting up CSS wasn’t until lesson 4 and only occurred after discussing the eight or so ways to select an element for styling.  In my mind, any “Hello World” introduction should only be superseded by a high level overview.
  2. Examples in the lessons that focus on individual elements are not always consistent and do not always work toward a single end point. Having a solid understanding of HTML definitely helped me fill in the gaps here.  I think this contributed to the book feeling unpolished.
  3. The later lessons could have been set up to build on one another without having to start from scratch each time.  (aka, make a Nav bar, add image to make a site header, add 2 columns plus footer, add a third column, …).  I spent a lot of time recreating something similar to what I built in previous chapters, and I couldn’t reuse it to build upon.
  4. After implementing rounded borders with images, I think I can better appreciate the support in CCS3.  I stumbled upon this demonstration page that I found helpful.

In general, I think the aspect of CSS that will take getting used to, coming from a pure coding background, is the padding and margins.  On a lighter note, I wanted to share, in all its hideous glory, the final result of trying to implement as many possible selector hierarchies as I could:

vintage 1996 internet

Finally, this is a list of differences I found between IE8 and Firefox 5 through casual observation during my pursuits:

  1. IE does not respect direct decedent selectors.
  2. IE handles several border style colorings different from Firefox.
  3. Firefox does not respect a background image for the a:visited psudo class.
  4. IE renders the clear: attribute differently than Firefox, at least in the example I was able to construct.
  5. IE does not render the margin: attribute of the table’s caption element, but it will render the padding: attribute.
  6. IE does not respect table caption margins.
  7. Firefox does not render the <div> element. From what I found, the border: property does not render nor do properties appear to apply to children elements, or at least FF respects them differently than IE.
  8. Firefox does not render/respect the a:active psudo class.

I’ll have to do a few follow up posts as I experiment more with CSS.  I’ve also placed the examples I created in a github repository here.

Additional CSS resources and reading:

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s