How to make link colour the same as parent div?

css, hover, hyperlink

Solution

If you want the link to have the same color as the div you should use `color:inherit;` and to turn to blue when hover you should use :

a:hover{
    color:blue;
}

Also with this code links dont change color when clicked.

Try:

HTML:

<div id="yellow"><a href="#">Yellow</a></div>
<div id="red"><a href="#">Red</a></div>

CSS:

a{
    color:inherit;
}
a:hover{
    color:blue;
}
#yellow{
    color:yellow;
}

#red{
    color:red
}

DEMO

EDIT (from comments)

To remove underline just use `text-decoration:none;`

DEMO2

Problem

Is there a simple rule that can be written in CSS to make all links take the standard font colour selected in the `div` they are in, but when they are hovered to go blue and when they are clicked to not permanently change colour. I only want them to light up when they are hovered on, otherwise remain the same, the only `div` this problem is occuring in is the one below. ``` .textundergrey { height: 140px; width: 950px; margin-left: auto; margin-right: auto; margin-top: 15px; font-family: "OpenSans Light", Arial, serif; font-size: 20px } ```

Original source