Is it OK to use <p3> and </p3> instead of <p class="style3"> and </p>

Thanks for your help guys. I have made the changes you recommended.

Two further things: Why when I use the div classes homepage and speedcamerasuk does it leave some space at the top before the content in the div class? I need to get rid of this white space, if I can.

Secondly, how do I change the colour of the ‘visited’ links. I tried changing “a:visited” but it does not work.
Matt.

Without seeing the changes it is impossible to suggest solutions.

Please supply a link to the online page.

I have just had another look at the OP’s code post. The boxes around the code are so faint that I had originally misread the code as all being in one file jumbled in the wrong order.

My apologies to the OP for an irrelevant comment caused by the colour scheme used by the forum.

John Betong,

I cannot provide the page online - as it is not online. It is the page I pasted in to this post earlier. The main problem is a:visited in all the CSS. It does not work.

Matt.

Hi Matt,

I searched for a solution to the visited problem but was unable to find a solution

I have simplified the script and the gap at the top has been removed. Also validation failed on text-colour :slight_smile:

Try this:


<div id='footer'>
	<div class='footlink'>
		<b>Speed Cameras UK</b>
		<ul>
		<li><a href="../../speedcamerasuk-about.htm">About Us</a></li>
		<li><a href="../../speedcamerasuk-contact.htm">Contact Us</a></li>
		<li><a href="../../terms-and-conditions.htm">Terms and Conditions</a></li>
		<li><a href="../../advertisers.htm">Advertising</a></li>
		</ul>
	</div>


	<div class='footlink'>
		<b>Shop</b>
			<ul>
			<li><a href="../../speed-camera-detector-shop.htm">Speed Trap Detectors</a></li>
			<li><a href="../../sat-nav-shop.htm">Sat Navs with speed cameras</a></li>
			<li><a href="../../cookies.htm">Cookies</a></li>
			</ul>
	</div>
 
	<div class='footlink'>
		<b>Site Maps</b>
		<ul>
		<li><a href="../../sitemap.htm">Site Map</a></li>
		<li><a href="../../sitemap.xml">XML Site Map</a></li>
		<li><a href="../../privacy-policy.htm">Privacy Policy</a></li>
		<li><a href="../../terms-use.htm">Terms of Use</a></li>
		</ul>
	</div>


	<div class='footlink'>
		<b>Social Media</b>
		<ul>
		<li><a href="http://www.facebook.com/SpeedCamerasUK" target="_blank">Facebook</a></li>
		<li><a href="http://www.youtube.com/user/SpeedCameras" target="_blank">YouTube</a></li>
		<li><a href="https://twitter.com/SpeedCamerasUK" target="_blank">Twitter</a></li>
		<li><a href="https://plus.google.com/b/118085000225419367133/+Speedcamerasuk" target="_blank">Google +</a></li>
		</ul>
	</div>
</div>




#footer {
overflow:hidden;
width: 969px;
float: left;
}


.footlink
{
float: left;
font: 80% Arial;
font-size:12px;
width: 17em; height: 8em;
border:1px solid #0099ff;
margin:10px 0px 0px 10px;
padding: 0 10px;
background-color:#DBF2FA;
}
.footlink ul
{
list-style-type:none;
margin: 0 0 0 1em;
padding:0;
line-height: 1.42em;
}
.footlink li
{
padding:1px;
}


.footlink a:link 
{
	text-decoration:none; /* common */ 
	color: black;
	background-color: transparent;
}
.footlink a:visited
{
	font-weight: 700  !important;
	color: #003399  !important;
	background-color: green;
  text-decoration: underline;
}
.footlink a:hover 
{
	color: #003399;
	background-color: lightgreen;
}
.footlink a:active
{
	color: #003399;
	background-color: lightpink;
}



HI,

You have used code like this "#link a:link, a:visited " all over the place:


#link a:link, a:visited {
	display:block;
	color:black;
	background-color:none;
	text-align:center;
	text-decoration:none;
}
#link a:hover, a:active {
	background-color:none;
	text-decoration: underline;
}

A comma separated list is just a list of selectors none of which have anything in common with each other apart from the property/values you supply below.

#link a:link, a:visited

You are first styling a:link with an id of #link and then after the comma you are styling all visited links. In further rules down the page you have made the same mistake and redefined all visited links again and not just the specific one you wanted.

It should be like this:


#link a:link,[B] #link a:visited[/B] {
	display:block;
	color:black;
	background-color:none;
	text-align:center;
	text-decoration:none;
}

Now only links and visited links within that specific id will be styled.

Look through the css and change all the other instances of this (and for :active also).

I forgot to mention in my post #25 that I /remmed/ all the links except the ones I was testing.

I have uploaded the modified webpage and CSS : here

I was still unable to make the visited links change colour, etc. The visited links were tested with the "The Social Media external links, Facebook, Youtube, etc. The links failed on both Opera and Firefox.

Any ideas why the visited links don’t do what I want them to do?

The footlink a:visited rules are working for me in all browsers. They go from black to blue when visited which seem to match the rules set. You have to follow the link and then return with the back button to see the effect.

Or am I looking at the wrong things?

Many thanks for taking the time for checking the links. I think I need to see an optician :frowning: