How to prevent "a" styling from applying to a link?

Question

Question by Dustin L.

I am trying to create a banner for my site without using an image. However, that banner is also a link.

Is there a way for me to override the use of the “a” (link) CSS styling from my div?

Assume the CSS looks like this:

a:link, a:visited {
    color: #176093;
}

#logo {
    color: red;
    font-size: 48px;
}

In other words, I’d like the CSS definitions for #logo to override the definitions for links.

Answer 1

Converting comments to answer:

Using this, you can specify styles within a given container:

#logo a {
    color: red;
    /* ... */
}

Answer 2

If you only want to apply your styles to the anchor within the div #logo, you have to use a selector like this:

#logo a { 
    color: red;
    font-size: 48px;
}