I have a few instances of an H3 tag on a page.

For one of them I want to apply an additional style.

I have created a new class called underline. Can I apply this style to this one instance of my H3?

I thought maybe something like this might work but no:

<h3 class="underline">

Any ideas?

Thanks.

Yes, you can do that. You can also combine classes, so if you already have a class for the H3 and you want to ADD this underline, you can do it like this:

<h3 class="red underline">, "red" being the first class, and "underline" being the 2nd.

Thank you. That works for me! Next question:

What if there is a link in the <h3> tag like <h3>link here</h3> and there is already h3 link styles. Can I overwrite them?

I have tried <h3 class="underline"> and creating link styles for underline like so:

.underline a:link, .underline a:active, .underline a:visited {
    text-decoration:hover;
    color:yellow;
    }
.underline a:hover {
    text-decoration:none;
    color:yellow;
    }

But the H3 link styles prevail.

You'll have to write it as h3.underline a:link, etc. See, .underline a:link could apply to ANYTHING, where as h3.underline is more specific and ONLY applies to an H3 with the class of .underline.

Thanks. Just to make matters more complicated those H3s are inside a div which has its own link styles so the actual h3 link styles had to be called #right-middle h3.underline a:link etc

I'm sure I'm doing something fundamentally wrong but it seems to work.

Originally Posted by Joe3000

Thanks. Just to make matters more complicated those H3s are inside a div which has its own link styles so the actual h3 link styles had to be called #right-middle h3.underline a:link etc

I'm sure I'm doing something fundamentally wrong but it seems to work.

What you're doing is fine.