Question

Code:

a:link { color: #111111; }
a:visited { color: #1b3a57; } 
a:hover { color: #f3371c; }

I have heaps of links on my site. And these states are working fine with, for example, the Footer text (links) and general body links. But the main navigation links and sub header links do not change state.

I have tested in IE 5+, Chrome, Opera, Safari, Maxthon, and FireFox but I get the same result.

What could cause this type of behaviour?

---

Update:

Header code:

#Header {
    width: 100%;
    height: 120px;

    background-image: url('/Shared/Assets/Images/OrangeDot.png');
    background-position: center bottom;
    background-repeat: repeat-x;

}

    #Header #MainLogo {
        float: left;
    }

Sub Header code:

#SubHeader {
    width: 100%;
    height: max-content;
}
    #SubHeader ul {
        float: left;
        margin: 20px 0 0 0;
    }
        #SubHeader ul li img {
            line-height: 1.5em;
            margin: -.30em 0;
        }
        #SubHeader ul li {
            padding: 0 10px 0 10px;

        }
            #SubHeader ul li a {
                font-size: small;
                /*color: #f3371c;*/
            }

---

HTML Mark-up:

        <ul id="MainNavigation" class="HorizontalMenu WithBullets">
            <li><a class="HighlightedMenuOption" href="@Href("~/Home")">Home</a></li>
            <li><a href="@Href("~/Protected/Account/")">Sign In | Register</a></li>
            <li><a href="@Href("~/Shared/Support/")">Support</a></li>
            <li><a href="@Href("~/Shared/")">About Us</a></li>
            <li><a href="@Href("~/Shared/")">Contact Us</a></li>
        </ul>
    </div>
    <div id="SubHeader">
        <div id="categories" class="s_nav">
            <ul>
              <li id="menu_home"> <a href="@Href("~/Home")">Home</a> </li>
              <li> <a href="@Href("~/Shared/Products/")"></a>
                <div class="s_submenu">
                  <h3>Categories</h3>
                  <ul class="s_list_1 clearfix">
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                  </ul>
                  <span class="clear border_eee"></span>
                </div>
              </li>
              <li> <a href="@Href("~/Shared/Products/")"></a>
                <div class="s_submenu">
                  <h3>Categories</h3>
                  <ul class="s_list_1 clearfix">
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                  </ul>
                  <span class="clear border_eee"></span>

                </div>
              </li>
              <li><a href="@Href("~/Shared/Products/")"></a>
                <div class="s_submenu">
                  <h3>Categories</h3>
                  <ul class="s_list_1 clearfix">
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                  </ul>
                  <span class="clear border_eee"></span>
                </div>
              </li>
              <li><a href="@Href("~/Shared/Products/")"></a>
                <div class="s_submenu">
                  <h3>Categories</h3>
                  <ul class="s_list_1 clearfix">
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                  </ul>
                  <span class="clear border_eee"></span>
                </div>
              </li>
              <li><a href="@Href("~/Shared/Products/")">Tek Screws</a>
                <div class="s_submenu">
                  <h3>Categories</h3>
                  <ul class="s_list_1 clearfix">
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                    <li><a href="@Href("~/Shared/Products/")"></a></li>
                  </ul>
                  <span class="clear border_eee"></span>
                </div>
              </li>
            </ul>
          </div>

Answer 1

If your HTML does not have a DOCTYPE try adding it .(Might Work … !)

As incorrect DOCTYPES lead to browser reverting to Quirks mode(IE) and CSS pseudo classes wont
get along well with DOM in such scenario. For futher reading take a look at doctype and css relation as seen in alistapart.com