Positioning problems

By Jim, on March 17th, 2011

I’ll admit up front that I know very little about CSS–just enough to be dangerous. As a result, I’ve been struggling with creating the layout for a new Web site. I’ve been doing everything else possible, but today I just had to do something to rationalize things. So I sat down with a book: CSS The Definitive Guide.

If this is the “definitive” guide, we’re in trouble. CSS is confusing, and this book doesn’t do much to lessen the confusion. I don’t have the time or the inclination to write a full review of a book that was published in 2006. Suffice it to say that I very highly recommend that you find some other book to get your information from.

One thing I’ve had a lot of trouble with in CSS is positioning elements on the page–making things appear where I want them to. So I turned to the “Floating and Positioning” chapter of the book, which appears to have a reasonably good discussion of the topic. I say appears because it turns out that the book’s description of the offset properties in the “Basic Concepts” part of the chapter is completely misleading:

[The offset] properties describe an offset from the nearest side of the containing block (thus the term offset). For example, top describes how far the top margin edge of the positioned element should be placed from the top of its containing block.

Whereas that’s true for absolute positioning, it’s not at all true for relative positioning. The offsets for relative positioning, as the book points out 30 pages later, are offsets from where the element would normally be positioned. With relative positioning, the offsets have nothing to do with the edges of the containing block.

It’s nice that the book eventually points out the difference, but failing to call out the difference in the overview discussion is a grave omission.

The implementation of CSS falls far short of the goal of creating a robust, easy to use, and easy to understand language for specifying the layout and appearance of Web pages. There are times when I think that the whole of CSS is a joke perpetrated by people who are laughing at those of us who try to use it.