A:link visited/active - not working - why? please help

Please help. For some reason the a:link visited is not working
I need the background of the link to be black when visited/active and instead it reverts back to original colour - this is annoying because u cant tell what page u are on unless the link is black

Here is the HTML

<!DOCTYPE html>
<html>
<head>
<title>Intranet</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="description" content="Intranet Home Page"/>
<meta name="author" content="Leanne Taylor" />
<meta name="robots" content="index, follow" />

<link href="CSS/layout.css" rel="stylesheet" type="text/css" media="screen" />
<link href="CSS/links.css" rel="stylesheet" type="text/css" media="screen" />
</head>

<body background="" id="coshh">
<br></br>

<div id="homewrapper"> 
<br></br>
<img src="logo/newlogo.jpg" alt="Logo" title="Logo" width="200" height="160" class="floatImageLeft" />



<div id="nav">
<br></br>

<ul>
    <li class="index"><h3><a href="index.html">Home</a></h3></li>
    <li class="accident"><h3><a href="accident.html">Accident</a></h3></li>
    <li class="coshh"><h3><a href="coshh.html">CoSHH</a></h3></li>
	 <li class="emergency"><h3><a href="emergency.html">Emergency</a></h3></li>
	 <li class="fire"><h3><a href="fire.html">Fire Prevention</a></h3></li>
	 <li class="method"><h3><a href="method.html">Method Statements</a></h3></li>
    <li class="riskcon"><h3><a href="riskcon.html">Risk Control Arrangements</a></h3></li>
    <li class="permit"><h3><a href="permit.html">Permit To Work</a></h3></li>
	 <li class="policies"><h3><a href="policies.html">Policies & Procedures</a></h3></li>
	 <li class="riskass"><h3><a href="riskass.html">Risk Assessment</a></h3></li>
	  <li class="sitein"><h3><a href="sitein.html">Site Inspection</a></h3></li>
    <li class="sitepack"><h3><a href="sitepack.html">Site Pack</a></h3></li>
	 <li class="swine"><h3><a href="swine.html">Swine Flu</a></h3></li>
	 <li class="temp"><h3><a href="temp.html" >Temporary Works</a></h3></li>
	<li class="train"><h3><a href="train.html">Training</a></h3></li>
	 </ul>

</div><!-- nav ends here -->


<div id="content">

</div>
<!-- content ends here -->



<div id="footer">

</div> <!-- footer ends here -->

</div>
<!-- wrapper ends here -->

</body>
</html>
</html>

Here is the CSS

#accident .accident a,
#coshh .coshh a,
#emergency .emergency a,
#fire .fire a,
#method .method a,
#riskcon .riskcon a,
#permit .permit a,
#policies .policies a,
#riskass .riskass a,
#sitein .sitein a,
#sitepack .sitepack a,
#swine .swine a,
#temp .temp a,
#train .train a;{ 
background-color:#000 !important; /* To override specificity on the page, !important has been added. */
color:#fff !important;
ext-decoration:none;
	}	

#nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}

#nav ul li {
margin: 0 0 10px;


}

#nav ul li a {
border-left: none;
display: block;
font-weight: bold;
text-shadow: none;
-moz-text-shadow: none;
-webkit-text-shadow: none;
text-transform: uppercase;
padding: 2px 5px;
}

#nav ul li a:link{
background-color: #d6e3ec;
border: 1px solid #000;
border-left: none;
color: #000;
width: 200px;
border-radius: 0 1em 1em 0;
}

#nav ul li a:visited {
color: #000;
background-color: #d6e3ec;
}

#nav ul li a:hover{
position: relative;
color:#fff;
background-color:#000;
width: 200px;
border-radius: 0 1em 1em 0;	

}

#nav ul li a:active{
color:#fff;
background-color:#000;
text-decoration: none;
}

 ul li a{
 font-family:"Times New Roman", Times, serif;
 font-size: 16px;
 }

You have the background-color of the visited block set to #d6e3ec, do you want that to be black?

if i change the background to black then it is black all the time - what i mean is that i need it to be black only when clicked and on hover too

[font=verdana]That isn’t what “active” means … it applies while you’re clicking on the link, or activating it using the keyboard. CSS can’t tell whether a link is pointing to the current page, so you need to put something in the HTML to tell it, usually something like <li id=“current”> and then you can target li#current a {...} to give the styling you want.

There are other options as well … if you want to know then just ask, I can’t stop now because I’m running 5 minutes laaaaaaaate![/font]

You’re gonna hate yourself for this… :slight_smile:

Delete the stray semicolon on line 14 of the css


#train .train a[color=red];[/color]{

Cheers!