Question

I just found this:

Note: a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective!!

Note: a:active MUST come after a:hover in the CSS definition in order
to be effective!!

Note: Pseudo-class names are not case-sensitive.

Does this mean that this is INCORRECT?

a:link, a:visited, a:active {
color: #006699;
text-decoration: none;
}

a:hover {
color: #2089CC;
text-decoration: underline;
}

Sadly the source is: http://www.w3schools.com/css/css_pseudo_classes.asp

If you don’t know why the ‘sadly’, please visit http://w3fools.com

Answer 1

Whenever in doubt go to the specs. And here’s an excerpt from the specs.

Note that the A:hover must be placed after the A:link and A:visited
rules, since otherwise the cascading rules will hide the ‘color’
property of the A:hover rule

What you have is correct

a:link, a:visited, a:active {
   color: #006699;
   text-decoration: none;
}

a:hover {
   color: #2089CC;
   text-decoration: underline;
}

That’s why this works.

This below would be incorrect.

a:hover {
   color: #2089CC;
   text-decoration: underline;
}

a:link, a:visited, a:active {
   color: #006699;
   text-decoration: none;
}

That’s why this doesn’t work.