Header Tag for specific Div

HTML & CSS
1

Hi,

Having a bit of trouble setting up a <h2> tag for a specified Div and would appreciate some advice. When i use this code anything that is specified in the .articles_div h2 will override the original H2 tag but if i dont specify something the original h2 tag will set properties that i dont want. How come this is happening even though i am specifying the div the H2 tag is in?

Thanks


<div class="articles_div">
  <h2>Diet Advice</h2>
</div>

h2 {
	font-family: Sue Ellen Francisco, Verdana, Arial, Helvetica, sans-serif;
	font-size: 30px;
	line-height: 40px;
	color: #73A780;
	margin: 20px 0px 0px 0px;
}

.articles_div h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	color: #e3963e;
	font-weight: bold;
	margin: 0px 0px 20px 0px;
}
2

This sounds strange. A rule for

.articles_div h2 {}

can’t affect any <h2> that isn’t in a div with class .articles_div.

Perhaps link us to a live page so we can vestigate further.

3

Are you saying that regular h2s are getting unwanted styles, suchas the styles from articles_div h2{}? If so, we will need a link, or even a sample page with this behavior happening. Slimming the page down should help a lot, though isn’t neccessary.