IE8 CSS: Conflict between opacity and hover behavior?

Hi. I’m having a problem with opacity and hover behaviors used together in IE8. The following links are tremendously stripped down for ease of illustration. The first link shows just the hover behavior for the links, and it works fine in Firefox, IE7, and IE8.

http://www.featurecity.com/test_page.php

This second link is the exact same page but with the opacity added to the CSS:

http://www.featurecity.com/test_page.php?opacity=1

Now, the opacity works, but the hover only works in Firefox and IE7, NOT in IE8. What gives?

I would greatly appreciate any help!

Thanks.

Hi,

The alpha image loader is very buggy especially where links are concerned. Add position:relative here:


#nav a:hover
{
	background-color: #539898;
	color: #FFFFFF;
	[B]position:relative;[/B]
}


Well, whaddya know, that worked. Thanks!