Size But Not Color Of H2 Picked Up In Link

Get Started
1

Sitepoint Members,

Why won’t the color of my H2 get picked up?

CSS
h1,h2,h3{color:#9F9FFF;line-height:1.2}
h2{font-size:130%;margin:3% 0 2%}

HTML

<table><tr><th><h2><a href=“/abc.html”>Example A</a></h2></th>
<th>    </th>
<th><a href=“/xyz-test.html”><h2>Example B</h2></a></th></tr></table><br /><br /><br />

This code creates a white “Example A” of h2 size heading and a white “Example B” h2 size heading.
The code also causes errors in the code for Example B:
line 99 column 5 - Warning: missing </a> before <h2>
line 99 column 60 - Warning: inserting implicit <a>
line 99 column 113 - Warning: discarding unexpected </a>

Why isn’t the purple color of the H2 for Example A being picked up?
When I fx the warning errors I get a white h2 font.

Thanks,

Chris

2

An <a> tag is an inline tag while a <h2> is a block tag. You must close any inline tags before you start a block. Try moving the <a> inside the Mh2>

Note that it is proposed to change <a> so it can work as a block tag in HTML 5 but browsers are unlikely to have fully implemented that yet - particularly with regard to the application of CSS.

3

Because you have an <a> inside it, so the text will be the color that the <a> is set to.

4

Felgall - I have that in the first line.
Ralp - Ok. So If I have links as one color and H2 another color, how can I make an H2 a link yet keep its color?

Thanks

5

If I have links as one color and H2 another color, how can I make an H2 a link yet keep its color?

You will just have to style the link differently. E.g. style any link inside an h2 to have the color that you want for h2s:

h2 a {color:#9F9FFF;}
6

Works great !

Thanks Ralph !