Question

In a given container, I have a bunch of links with another element inside it, like so:

<div class="container">
     <a href="whatever.com">
          <h6>Link Text Here</h6>
     </a>
</div>

And I have CSS which I want to use to format all links inside the “container” class:

.container a {
    color: #00f;
}

However, there are other external stylesheets which set the color of “h6” to something else. Is there a way to make my CSS for links in the “container” override whatever someone else has put for “h6”? I don’t want to override all “h6” in the “container”, because there are some “h6” tags which are not links.

Answer 1

I am thinking you could use the !important to provide overriding.

   .container a h6
    {
       color: red !important;
    }