Forum Moderators: not2easy
I'm currently trying to write up a CSS navigation menu, and I'm having a little problem in IE 6.
Problem can be viewed at: removed
The problem is with the 2 menu items in the top-right corner. In Firefox, everything works fine. In IE6, "A:hover" works when the mouse is rolled over the menu item, but when the mouse rolls off, hover stays active.
Any ideas most appreciated.
Cheers,
- JB
CSS:
/* CSS Document */#mainbox {
background: #FFFFFF;
width: 765px;
height: 1200px;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
margin-bottom: 0px;
border-style: solid;
border-color: #666666;
border-width: 2px;
padding: 0px;
}
#headerbackground {
background: url(topbg.jpg);
background-repeat: repeat-x;
float: left;
width: 759px;
height: 80px;
margin: 3px;
border: 0px;
padding: 0px;
}
#headermenu {
background: url(topmenubackgroundtp.gif);
width: 101px;
height: 80px;
padding: 0px;
margin: 0px;
float: right;
border: 0px;
text-align: center;
vertical-align: bottom;
background-color: #0000FF;}
A:link #headermenu {
background-color: #0000FF;
}
A:visited #headermenu {
background-color: #33CC33;
}
A:active #headermenu {
background-color: #CCCCCC;
}
A:hover #headermenu {
background-color: #FF0000;
}
#headermenu p {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 12px;
color: #FFFFFF;
margin-top: 55px;
}
[edited by: SuzyUK at 10:09 am (utc) on Sep. 20, 2006]
[edit reason] Please no URLs : see TOS #13 [WebmasterWorld.com] [/edit]
I just tried your page in IE6 and it worked fine, maybe it's a problem with your IE.
Chris.
You should change these:
A:link #headermenu {
background-color: #0000FF;
}
To these:
#headermenu A:link {
background-color: #0000FF;
}
Chris.
