Superfish IE a:hover background issues

[pinyon]

I’m new at coding CSS/Jquery drop-down menus, and am having a problem with background color change on a pair of Superfish menus that I’m trying to set up on the same page. One is a drop-down, and the other is a fly-out.

I can’t figure out how to code my css file so that the background changes color over the entire width of the menu anchor tag for any version of IE. Both menus work fine in Firefox. The hover background color stops at an embedded png file before the end of the anchored section. It looks bad.

I suspect that I need a conditional tag in my html file and/or a combination of the correct css style code. I’ve tried many, many, many code variations to fix this issue, and am stumped. You can see the problem at:

http://www.cnhp.colostate.edu/test/index.html

the css file is:

http://www.cnhp.colostate.edu/test/cnhp.css

Any help would be greatly appreciated. Thanks.

Fagan

[calebkester]

The problem that I’m looking at seems even a bit finicky in FF. It’s when you hover over the left menu and that box pops out.

You have a margin-left that is causing the hover box to "pop" out.

Code:

#left a, a:visited {cnhp.css (line 266)
color:#FFFFFF;
font-size:10px;
margin-left:10px;
text-align:left;
text-decoration:underline;
}

Try that to see if it helps both browsers.

Once that gets done what else is left to deal with?

[Author]

Posts