CSS issues in IE7

Question

I'm having the weirdest most annoying issue with my web page. It's located at [2012sbc.com/demo][1]. If you click on the link for Promotional Material, then click on one of the downloads, then refresh the Promotional Materials page, it's using the a:visited, a:hover, and a:active properties from an entirely different div, the navigation.

I tried to set a whole new div for just the links on the page, and then those properties mess with my navigation!! I can't just like, set a class, then set another one, they interact with each other and I have no idea why. And of course, it's only happening in IE7.

Can someone check it out and tell me what I did wrong? I'm at a complete loss!!

edit: Screenshot located: https://trigger.lwcdirect.com/LWC_00486/uploadImages/2012sbc/screenshot.gif

And I personally don't care about IE7, but that's what our client uses and so I have to make it work.

2nd edit: None of these things are helping, does anyone else have any suggestions?

Answer 1

Try this,

.roundside a {color:#990000; font-weight:bold}
.roundside a:visited,
.roundside a:hover,
.roundside a:active{ color: #F00; font-weight:normal; }

Hope that help you :)

Answer 2

There is no point in a:visited for main-menu. what if the user visited more than one item in the menu? you want to paint it as visited? it's a menu, not a normal link.

But, if you still want this behaviour then:

In the oneColFixCtrHdr.css you declared:

A:visited {
    BACKGROUND-IMAGE: url(https://trigger.lwcdirect.com/LWC_00486/uploadImages/2012sbc/darkredbar.jpg)
}

You should scope it like this:

.oneColFixCtrHdr #stripes UL A:visited { 
        BACKGROUND-IMAGE: url(https://trigger.lwcdirect.com/LWC_00486/uploadImages/2012sbc/darkredbar.jpg)
    }

In order to apply it on your main-menu.