Firebug is an addictive little addon to Firefox which lets you inspect the CSS properties of essentially anything you can click on and modify them in real time. This lets you easily simulate what would happen if you actually changed the properties, except without needing a page refresh cycle. If you play around with it, it can help answer the big (and befuddling) questions like What Line In My 2,000 Line CSS or HTML File Makes This Box Go Here, which throw non-designer me for a loop.
I used Firebug for ten minutes to make some changes to Bingo Card Creator’s site that I’ve been putting off for over a year now. People would actually mail me to say “You know, your header doesn’t actually go the entire width of your content area — the menu on the right juts out a little” (twelve pixels, as it turns out). I always thanked them for the comment and made a mental note to do something about it, then (when I actually opened the CSS file) got lost and gave up.
It also gives me a feeling of ownership of the design, which (since I am not a designer and have the artistic acuity of a nearsighted mole) I generally treat like holy writ that I am not fit to alter. While I was on a roll doing pixel-perfect accuracy, I changed something that has been a nuisance forever — teeny tiny font in my H1 and H3 headers (11 pixels for a page header… not a quality choice! But I put up with it for forever). I think they are both more visible and more aesthetically pleasing now.
If you have any comments on the new design I’d love to hear them. It isn’t a quantum leap in quality, obviously — just an evolution of inches, like most of the things I do.