user1015214
user1015214

Reputation: 3081

css not affecting link in chrome

I am trying to change the color of a link. It is defaulted to blue and I want to override it. I did the following:

#site-links a:link{color:red;}

and in Chrome's Inspect Element that was the style which overrode all other styles. However, the link remained blue. In Firefox, however, the link is now red. How can I fix this?

Upvotes: 0

Views: 158

Answers (2)

vals
vals

Reputation: 64164

One way to give higher priority to your rule is stating important in it.

a:link { color: red ! important }

Also, when in Chrome inspector , to better control what is happening, you can force the state of the inspected element

When in the element inspector, go to the top of the "styles" bar in the right pane. There is an option that states:

"toggle element state"

There you can check / uncheck the :visited status

Upvotes: 0

Andy
Andy

Reputation: 14575

:link targets specifically a link you have not visited. I'm going to go ahead and assume that in chrome you have visited it. You can fix it by targeting each case as you need it:

a:link    { color: red; }      /* unvisited link  */
a:visited { color: blue; }     /* visited link    */
a:hover   { color: green; }    /* mouse over link */
a:active  { color: yellow; }   /* selected link   */

Upvotes: 2

Related Questions