Explore our sites

Stack Exchange
tour help careers 2.0
Take the tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

When I link my footer text to content it changes them to a dark grey because the links on the rest of my website are set to that color. I am looking for some CSS to select and change only my footer links color to #fff , and preferably with a hover color of #fa5705 .

When I use firebug to inspect I can't seem to pick up the right selector and only for the entire website.

www.jobspark.ca is the link to my website.

Thanks for taking the time to look into this for me.

enter image description here

share|improve this question
add comment

2 Answers

up vote 1 down vote accepted

Looks like you want to do:

#page-footer a {
     color: #fff;
}

#page-footer a:hover {
     color: #fa5705;
}
share|improve this answer
add comment
up vote 0 down vote

I noticed in your footer all of your text is contained in < p > are white; but the links them-selves are colored differently. To fix this you can simply add that color attribute to each link element like so:

<a style="color:white;" href="/contact-us">Contact Us</a>

Unfortunately you cannot add hover styling in-line you so have to place that CSS else-where and connect to it with an id or class... since you have multiple links to be hovered a CLASS would be preferable over an ID. And while we are using classes lets just put that color styling inside of the class too.

<style>   
    .myHover{
      color:#fff;
    }
    .myHover:hover
    {
      color:#fa5705;
    }
</style>

<a class="myHover" href="/contact-us">Contact Us</a>

I tested this CSS and it works; here is the JSFiddle.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.