HTML and CSS Reference
The goal for this example is to design a simple personal site as a sort of “portal” to this author's
various interests, which he can keep separate from his blog. To do this, we'll use four major
areas (design, programming, singing, and writing) along with a few links to favorite online
Note This layout can be seen in action at www.danielrubin.org/procss/nohacks/ .
We can't use any complex floats (the easy float clearing method includes a hack, so it
doesn't qualify for this example), perform any real multiple-column trickery, or do anything
that might trigger IE's strange layout rendering (using the Holly hack is not an option either).
That said, we don't want boring, so after spending a little time in our sketchbook and Photo-
shop (plus a nice logotype courtesy of the amazing Anton Peck), we've settled on a layout that
we're happy with (Figure 6-7).
Figure 6-7. Our proposed layout (complete with dummy link text) in Photoshop