It keeps changing! It's looking pretty good in Firefox, has a couple quirks in IE and I haven't even started thinking about Chrome or anything else. It's missing the blog title, and a background image or two. It's clearly a work in progress. A pixel high mis-match in IE is currently breaking my spirit, so I'm going to go ahead and pretend it's not there and move onto other things. Maybe everybody uses Firefox and will never notice.
Yesterday I learned an interesting way to make rollover images in CSS. I resisted at first, balking at the idea of using a "hack", but came to realize it works rather well. In the past, I've made buttons with two images- one is the the normal state, the other is hover. Here, a single image is used with the two (or more) states side-by-side or stacked.
Single Image with Both States
In the normal state, the first half is shown, and on rollover/hover, the position of the image is changed so that the second half shows. It feels hacky, but there's no flicker like you might see with the old method. It looks pretty slick! About here I was going to show the CSS, the HTML, and the final button, but I realize that it's a lot simple, and a lot clearer to just point you to my sources :)
Webvamp: CSS Image Rollover or Chromatic: CSS Image Rollovers: Accessible, Standard Compliant, Flicker-Free
Now go hover over my menu items.