Footer links CSS to overwrite default

This might be a really daft question, but I can’t get it to work:


See the contact . sitemap . (c) fabian bauer - 2010 on the bottom? How can I make those links white using css?

So far I have put them into a

<div class="footer">links here</div>

statement and added a line in my stylesheet which reads:

a:link, a:visited {
	text-decoration: none;
	color: #555555;
a:active {
	text-decoration: none;
	color: #FFFFFF;
a:hover {
	text-decoration: underline;
	color: #888888;
.footer {
	text-align: right;
	font-size: 12px;
a.footer:link, a.footer:visited {
	color: #FFFFFF;

So if I understand it correctly, the last two statements should supersede the default a statements above it. Am I correct? It doesn’t seem to be working!

Any help would be greatly appreciated.


It should be

.footer a, .footer a:link, .footer a:visited, .footer a:active, .footer a:hover {
	color: #FFFFFF;

Since it is the links reside in a div with class “footer”, and the links themselves don’t have the class footer (as your CSS code suggested).

I added “.footer a” and the :active and :hover pseudo-classes for completeness sake.
Without “.footer a” some older versions of IE sometimes display the links incorrectly.

duuuh of course!

Thanks for the quick help!