Is this a valid css?

Question

I have a pager in my page with anchors in it... I use the following css...

.page-numbers a {
color:#808185; cursor:pointer; text-decoration:none;outline:none;
}
.page-numbers a:hover {
text-decoration:underline;
}
.page-numbers a:visited {
color:#808185;outline:none;
}

But my anchor tag doesn't seem to take the css above instead it uses the css below,

a {
color:#0077CC; cursor:pointer; text-decoration:none;outline:none;
}
a:hover {
text-decoration:underline;
}
a:visited {
color:#4A6B82;outline:none;
}

Which i have given in the top of my stylesheet... Any suggestion...

Answer 1

The selector .page-numbers a means "an anchor tag inside a tag with the class page-numbers", e.g.:

<div class="page-numbers"><a>This would match</a></div>

If you mean an anchor tag with the class page-numbers, use:

a.page-numbers {
    color:#808185; cursor:pointer; text-decoration:none;outline:none;
}
....

Answer 2

Are you sure your links are under a container with page-numbers class?

Are you sure your stylesheet is linked to the page correctly?

Are you sure its not link with page-numbers class? In that case you'll have to use a.page-numbers css selector to target the link.