About a year ago, I spent the better part of a day making this site's layout entirely em based and set on a vertical baseline grid... No, I mean, everything is em based: font-sizes, borders, margins, padding, widths, everything. Each individual value in the stylesheet that specifies a vertical measurement was manually calculated based on the relative value of an em on the specific element.

This has two notable effects:

1. Your site can be scaled to any font-size on the client while retaining exact proportions in every way and while staying on the vertical grid. (Go ahead. Try it if you don't believe me. Just hammer on Command+- a few times.)

2. Your CSS becomes completely unmaintainable.

The second effect is as much of a nightmare as the first effect is wonderful.

Here's a snippet from the stylesheet. You must believe me when I tell you this made perfect sense when I was writing it:

/* HEADER */
body{ 
  margin-top:1.428em;                  /* 20px */
}
#header,#footer{
  font-size:0.857em;                   /* 12px */
  line-height:1.666;                   /* 20px */
  color:#333;
}
#site-meta{
  margin-top:0.357em;                  /* 5px */
  border-top:0.083em dotted #aaa;      /* 1px */
  padding-top:0.333em;                 /* 4px */
  padding-bottom:0.083em;              /* 1px */
}
#nav a{
  padding:0 0.416em;                   /* 5px */
}

The first sign of trouble comes after a month or so when you decide to change a margin or a font-size or whatever. You open the stylesheet and ... Surprise! You need an abacus.

Later, you just plain give up:

/* DRAFTS */
ol.drafts li h4 { margin-bottom:5px }

I laugh every time I see that.

What's worse is that the new page zooming features slated for Firefox 3.0, and that has apparently already landed in Opera and IE7, makes all this effort completely unnecessary. Now you can lay the site out in pixels and the rendering engine maps you into a scaleable/transformable coordinate system automatically. This means that the morons doing web development in Microsoft Word are now producing stuff that is every bit as perfectly zoom-able as my carefully calculated stuff and their stuff is probably easier to maintain.

Sigh.

Speaking of morons, did I ever tell you about the guy that spent the better part of a day making his site's layout entirely em based ...