I'm no designer but there are a couple of things I know I like. One of them is max-width. On my first attempt at a theme, I fixed the width at 775px. I've never liked doing that because it looks so crappy on my 1600x1200 resolution laptop. By the same token, I'm getting too old to read text that scrolls across that entire screen.

So what I really want is to say, "expand this as the window expands, but only up to a point." In other words, I want to set a maximum width on my content.

That's what the max-width CSS property is supposed to do and that's exactly what it does do in Firefox. IE6 doesn't support it but there is a workaround:

width: expression( document.body.clientWidth > 990 ? "990px" : "auto" );

Seems IE lets you insert javascript into your CSS which was easier for them to implement than just following the CSS spec...I guess...Whatever, the reason, my theme uses that (plus a little additional ditty to impose a minimum width) and now I get what I want.

But not without some problems. When I tested it originally in my theme, the maximum width worked in that it wouldn't go past 990px. But it also wouldn't adjust when I made the window smaller than that. In essence, I had a fixed width 990px DIV. But I had seen this working in practice so I couldn't figure out why mine didn't work.

It wasn't until I removed the DOCTYPE declaration for loose.dtd at the top of my theme that it actually did start working. Weird.

The only other major thing I wanted to change is the image at the top. I switched it from an explicit <img> to a background-image so that, again, I could make my page more liquid without having scrollbars appear at inopportune moments.

And it's *$%-ing annoying having to support two browsers again. One of them had better win this war soon...