6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

Style.css not changing font colour!

by galisgos
4 replies
  • WEB DESIGN
    • |
I want to change the colours of the links on my wordpress site, but editing the style.css file does not bring about any change!

I have:


a {
text-decoration: none;
color: #27d;
}

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

a:visited{
text-decoration: none;
color:#333;


In the style.css but changing these numbers makes no difference whatsover.

Where else could I be going wrong?
#changing #colour #font #stylecss
  • Profile picture of the author diptangsu
    Hi

    You did not tell that your style.css linked and working properly or not. If it working with other css property then write it these way and try it again..

    a:link {color:#FF0000;} /* unvisited link */
    a:visited {color:#00FF00;} /* visited link */
    a:hover {color:#FF00FF;} /* mouse over link */
    a:active {color:#0000FF;} /* selected link */


    When setting the style for several link states, there are some order rules:
    1. a:hover MUST come after a:link and a:visited
    2. a:active MUST come after a:hover




    Here i am giving you a example with internal css. Hope it could help you..


    <html>
    <head>
    <style type="text/css">
    a:link {text-decoration:none;} /* unvisited link */
    a:visited {text-decoration:none;} /* visited link */
    a:hover {text-decoration:underline;} /* mouse over link */
    a:active {text-decoration:underline;} /* selected link */
    </style>
    </head>

    <body>
    <p><b><a href="#" target="_blank">This is a link</a></b></p>
    <p><b>Note:</b> a:hover MUST come after a:link and a:visited in the CSS
    definition in order to be effective.</p>
    <p><b>Note:</b> a:active MUST come after a:hover in the CSS definition in order
    to be effective.</p>
    </body>
    </html>




    Thanks & regards
    Diptangsu
    {{ DiscussionBoard.errors[4366795].message }}
  • Profile picture of the author galisgos
    Hello

    Thanks for the reply. Not sure if I follow correctly, should I paste:


    a:link {color:#FF0000;} /* unvisited link */
    a:visited {color:#00FF00;} /* visited link */
    a:hover {color:#FF00FF;} /* mouse over link */
    a:active {color:#0000FF;} /* selected link */

    Into the style.css?
    {{ DiscussionBoard.errors[4366856].message }}
  • Profile picture of the author diptangsu
    yes...

    can i catch you through skype??
    {{ DiscussionBoard.errors[4366895].message }}
  • Profile picture of the author rufaswan
    Did you know CSS is inherit from top to bottom? If your stylesheet has a:link on top and #content a:link on bottom, #content a:link will overwrite the standard a:link.

    I would suggest you check the div that preceed it and work from there. Or better still, use Firefox + Firebug to know all inherit styles by just point-and-click.

    - Rufas
    {{ DiscussionBoard.errors[4367756].message }}

Trending Topics