Hover Navigation Background not working

[buildakicker]

Hi all,

I am baffled as to why the background I have assigned to the HOME button will not show up when I roll over the other buttons. You can view the page here.

Any ideas?!

[Centauri]

The <a>s themselves are only as high as the current line height (being inline elements), and the home background has been applied as a background to the home image itself. Applying the hover to the other menu images will work :

#navigation a:hover img {
	background-image: url(images/navigation_background.png);
	background-repeat: no-repeat;
	background-position: center center;
}

[Centauri]

Alternately, instead of the above, you could float the <a>s so they are block display :

#navigation a, #navigation a:link{
float: left
}

[buildakicker]

Thanks a bunch! So since the menu items are images, you have to apply the background to the menu images for it to work? Is that what is being said? I used the Second post, since it's less code in any case... Thanks again!

[Centauri]

Either way will work as the link images are transparent and they have the padding, although it is usual to use the <a>s for the background. As the home button has the background image applied to the home image rather than the <a>, the hover on the <a> also gives the nice effect of a hover on the home link due to two png images being stacked.