Links problems with IE

[ced--ced]

Hi, Please have a look at the website I’m currently working on www.theminnesotafats.com/uig. I have two problems with it that appear with IE but not FF:

1. On the left nav bar, I put a green background when you rollover. After having click on it, I want that the buttons remain the same with this green background appearing when you rollover. The problem is in IE, after having clicked on any button, the green doesn’t show up anymore when you rollover.
Here’s my code:

#navbar a:link, #navbar a:visited {
display: block;
padding: 3px 0 3px 0;
background-color: transparent;
color: #000000;
text-decoration: none;
}
#navbar a:hover {
display: block;
padding: 3px 0 3px 0;
background-color: #003300;
color: #FFFFFF;
background-color: #013302;
text-decoration: none;
}

2. Second problem and quite similar and still only with IE. If you go to the products page, you will have 3 tabs above the content. I’ve set it up in a way that it’s never underlined. However, in IE(!), the text is underlined after visiting the pages.
Here’s the code:
#tabs a:link, #navbar a:visited {
background-color: transparent;
text-decoration: none;
}
#tabs a:hover {
background-color: transparent;
color: #013302;
font-weight: bold;
text-decoration: none;

If you have any idea, please advise! Thanks

[catbert303]

Hi,

for the first problem if you don't want the visited state to appear an differently to the normal links you could simplify things like this,

#navbar a {
display: block;
padding: 3px 0 3px 0;
background-color: transparent;
color: #000000;
text-decoration: none;
}
#navbar a:hover {
color: #FFFFFF;
background-color: #013302;
}

if you want to keep the different a:link and a:visited selectors you could try making your :hover selector more specific, something like this,

#navbar ul a:hover {
color: #FFFFFF;
background-color: #013302;
}

Again with the 2nd problem try replacing the specific selectors for a:link and a:visited with just a


#tabs a {
background-color: transparent;
text-decoration: none;
}
#tabs a:hover {
background-color: transparent;
color: #013302;
font-weight: bold;
text-decoration: none;
}

[ced--ced]

:thumbsup: That works great thanks!!!