Question

This is my CSS code that is supposed to reformat links:

a {
color: #120000;
text-decoration: underline;
}

This is my HTML code:

<div id="intro" class="grid_9">
     <h1>This site just might change your life</h1>
     <p><a href="#" class=button>Browse Our Features</a></p>
</div>

The problem is that the header (but only this one) is being affected in the same way as the links. How can I fix this?

No correct solution

OTHER TIPS

Just add a class to the <a> tags that should not follow it or use the existing one depending on whether or not that class is specifically for that purpose. Then, use the :not() selector:

a:not(.button) {
    color: #120000;
    text-decoration: underline;
}

Fiddle: Fiddle

Also, the header would only follow the CSS for the <a> if it were wrapped in an <a> tag. If this is true, give that <a> tag the set class.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top