Styling links in CSS

pretty basic, really

[liza]

I'm just learning CSS. Everything in my external style sheet seems to be working on the page, except for the styling to my links. Here's what I've got in the style sheet:

a: link {
color:#336633;
font-weight: bold;
text-decoration:underline;
}

a: visited {
color:#660000;
font-weight: bold;
text-decoration:underline;
}

a: hover {
color:#660000;
font-weight: bold;
text-decoration:none;
}

What am I forgeting?

[benihana]

it looks like you have a gap:

a: link

should be

a:link

[liza]

Yes, that was it. Thanks.

[pageoneresults]

There are a few more things you can do. Since you have similar styles for various link states, you can declare them like this...

a{
font-weight:bold;
text-decoration:underline;
}
a:link{ 
color:#336633;
}
a:visited{ 
color:#660000; 
}
a:hover{ 
color:#660000; 
text-decoration:none; 
}
a:active{
color:#000000;
text-decoration:none;
}

You'll notice that I added a fourth state for the link labeled

a:active

. This is the state of the link when clicked. The order for links is always LVHA (Link/Visited/Hover/Active). They will not work correctly if the order is incorrect.

Now, we can take the above and go one step further by using CSS Shorthand for the color values since they are all Paired Color Values...

a{
font-weight:bold;
text-decoration:underline;
}
a:link{ 
color:#363;
}
a:visited{ 
color:#600; 
}
a:hover{ 
color:#600; 
text-decoration:none; 
}
a:active{
color:#000;
text-decoration:none;
}

[ergophobe]

Or one step further, or maybe a step to the side since it's less readable, but fewer bytes, so depending on priorities you might find this a step backwards.

Total savings seems small, but in a large stylesheet you can save a lot this way.

This saves 26 bytes in most OSes, 29 bytes in a Windows file because of the two-char new line.

a{
font-weight:bold;
text-decoration:underline;
color:#363;
}
a:visited,a:hover{
color:#600;
}
a:hover,a:active{
text-decoration:none;
}
a:active{
color:#000;
}

If you're willing to make it still a bit harder to read, you bring the total savings to 36 bytes (49 for a Windows file).

a{font-weight:bold;text-decoration:underline;color:#363;}
a:visited,a:hover{color:#600;}
a:hover,a:active{text-decoration:none;}
a:active{color:#000;}

If I get this agressive at all, it's only after the stylesheet is really set and tested and should be essentially stable until the next major overhaul.

Tom