Problem med <h1> <h2>

Hej,

Sitter och försöker skapa lite ordning och reda i min css-struktur. Scenariot är följande:

Har följande HTML-kod:

<div id="content">

	<div id="content_two_columns" style="height: 300px auto;">
	<h1>Nyheter</h1>

    	<table style="width: 100%; padding: 0;">
		<tr>
			<td style="width: 70%; border-bottom: #888 solid 1px;"><h2>Rubrik</h2></td>
			<td style="width: 20%; border-bottom: #888 solid 1px;"><h2>Författare</h2></td>
			<td style="width: 10%; border-bottom: #888 solid 1px;"><h2>Publicerad</h2></td>
		</tr>
		<tr>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		</tr>

CSS-kod:

#content h1 {
    	margin: 0;
	padding: 0;	 
   	font-size: 22px;
   	color: #0E3171;
   	letter-spacing: 0px;
}

#content h2 {
  	margin: 0;
	padding: 0; 
   	font-size: 15px;
    	color: #2CA6F0;
    	letter-spacing: 0px;
}

Det jag vill göra är att definiera <h1> och <h2> för hela min sida. Dessa två element skall gälla inom #content och alla underliggande divar! Är det rätt så som jag har gjort nu?

eller ska man skriva så här:

CSS-kod:

#content, #content_two_columns h1 {
    	margin: 0;
	padding: 0;	 
   	font-size: 22px;
   	color: #0E3171;
   	letter-spacing: 0px;
}

#content, #content_two_columns h2 {
  	margin: 0;
	padding: 0; 
   	font-size: 15px;
    	color: #2CA6F0;
    	letter-spacing: 0px;
}

Om du vill ha en tabellrubrik bör du använda <th> istället för <td><h2>. :)

Du ser hur vilsen jag är i CSS-djungeln :) Check på den!