Optimum way of writing this code?

#leftnav a:link, a:visited {
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
color:#ffffff;
font-weight: normal;
}


#leftnav a:hover, a:active {
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
color:#ffcc33;
font-weight: normal;
}




a:link, a:visited {
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
color:#4f63e3;
font-weight: normal;
}

a:hover, a:active {
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
color:#ffcc33;
font-weight: normal;
}

What is the most optimum way of writing this code.

There seems to be a conflict when I try to achieve this.
In FF2 the last two blocks when present over-ride the previous 2 block values.
When absent, all the links (not just the div links) take the color value of the previous blocks.

In FF2 the last two blocks when present over-ride the previous 2 block values.
When absent, all the links (not just the div links) take the color value of the previous blocks.

Of course, because you tell it to do that.
Your code:

#leftnav a:link, a:visited {…}

Correct code:

#leftnav a:link, #leftnav a:visited {


See any difference?
You have to specify the correct selectors because the #leftnav only counts for one following selectors, the second one would apply to all visited links if you don’t add the #leftnav selector as well.

Then, if you specify the most general rules at the end thn of course they overwrite the previous ones (except if they have a higher specifity due to ID selectors or something to that effect).

Also if you specify styles for links in general, you only have to specify styles that actually change for :hover or :visited, etc. I.e. your code could be written like that:

a {
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
color:#4f63e3;
font-weight: normal;
}

a:hover, a:active {color:#fc3;}
#leftnav a:link, #leftnav a:visited {color:#fff;}

thanks, now I feel like an idiot.
Takes time to grasp all the basics of CSS.

Anyway now I understand the logic of your code (quite concise too). However that didnt work out 100% as desired.. the following did.
a {
font-family: Helvetica, Arial, sans-serif;
text-decoration: none;
color:#4f63e3;
font-weight: normal;
}

a:hover, a:active {color:#fc3;}
.navlinks a:link, .navlinks a:visited {color:#fff;}
.navlinks a:hover, .navlinks a:active {color:#fc3;}

Any idea why the #fff text links were not turning #fc3 on hover without the last line.

http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html