gradient spanning background on an a:hover

I seem to have an issue with this one. Not sure why. Errors show in IE 6 & 7, and Safari 3.0. The padding is not having the borders (dividers) run fully from top to bottom and hover background graphic.

http://www.happydogwebproductions.com/nerdery/

http://www.happydogwebproductions.com/safari.jpg

I'd suggest:

#menu a {
display: block;
float: left;
line-height: 21px;
padding: 23px 19px;
}

#menu {
margin: 0;
}

Making your anchor a block element fixes the hover behaviour (in IE at least, I don't have Safari 3).

(As an aside, it's generally considered more appropriate/semantic to code your menu as an unordered list.)

Thanks!