Override Anchor color to inherit the default color

Question

I am trying to override the binding color and set the color to what would normally be without a link.

Original code

<a href="..."> <div class="right"> <div class="text"> Some Text </div> </div> </a> 

CSS selectors for targeting classes "right" / "text" I tried:

 a .right { color:inherit; } a:link .right { color:inherit; } 

Nothing works.

Answer 1

Put the class on the anchor itself, and then set:

 .yourAnchorClass { color: inherit; } 

See an example script.

Inheritance comes from the parent element. So all your decisions say that the div inherits the color of the binding. By the way, this is actually invalid html to have a div inside the a tag (block level element inside the inline element). If possible, it would be better to change them to span and then set display: block to span elements inside a .