Ubicación correcta de etiquetas.

[Azer]

Hola gente de forosdelweb! Este es mi primer post. Quería comentarles que estoy creando mi primer página web y necesito una ayuda con un problema que me surgio.

Intento validar mi web a la medida que la voy creando, no quiero tener que corregir un millon de problemas cuando esté "terminada". Estoy utilizando un Doctype xhtml 1.0 strict. Cuando validaba mi web me dio el problema de que no podía insertar una etiqueta <h4> dentro de una <a> (seguro esto es un error muy tonto, pero sepan que recien estoy comenzando) y combinado con estilos css llegaba al resultado que yo quería. Por no querer comenzar mal y dejarlo así lo arregle y esta es la porción del código html que me quedo:

Código HTML:

<div class="navbar">
	<ul>
		<li><h4><a href="index.html">HOME</a></h4></li>
		<li><h4><a href="contacto.html">CONTACTO</a></h4></li>
		<li><h4><a href="historia.html">HISTORIA</a></h4></li>
		<li><h4><a href="otro.html">OTRO</a></h4></li>
	</ul> 
</div> 

Esa es la porción del código html de mi menú horizontal. Antes de validar y corregir mi código, yo tenia algo parecido a esto:

Código HTML:

<li><a href="index.html"><h4>HOME</h4></a></li> 

Esto me permitía que al posicionarme dentro de cada caja (es el diseño que posee, un cuadrado con la sección dentro) de mi menú, lo tomaba como enlace y se aplicaban mis estilos css que eran cambiar el background por una imagen y el color del texto de la fuente. Ahora solo puedo hacer que al ubicar mi puntero dentro de la caja del menú se cambie el background, y solo se cambia el color de la fuente cuando pongo el puntero dentro de mi texto (Ej: Home) y solo en ese momento es cuando me lo toma como enlace.

Dejo unas imágenes para que puedan observar a lo que me refiero:
Puntero dentro de la caja de menú y no arriba del texto: (cambia el background por uno con degradado aunque no lo puedan apreciar)

Puntero arriba del texto/enlace:


Bueno, creo que hice la explicación un tanto complicada, pero quería que entiendan fácilmente. Quiero saber si es posible hacer que al posicionarme dentro de la caja del menú ya me lo tome como enlace, pero que a la vez pueda ser validado.
Saludos y muchas gracias!

[ArturoGallegos]

muestra tu CSS para ver el error, puedes probar colocar

.navbar li a{display:block;}

[Azer]

Iniciado por Ag666

muestra tu CSS para ver el error, puedes probar colocar

.navbar li a{display:block;}

Muchisimas gracias, la verdad no conocía ese atributo! Me salvaste!

Modifique mi:

Código HTML:

.navbar ul li a{

Dejo mi porción de código para que observen lo que modifique por si a otro puede llegar a servirle:

Código HTML:

.navbar{
	height:35px;
	width:960px;
	background:url(images/navbar.png)
}

.navbar ul{
	padding-top:0px;
	margin-left:0px;
}

.navbar ul li{
	float:left;
	font-family:arial;
	margin-left:5px;
	background:url(images/botnavlink.png) no-repeat;
}

.navbar ul li:hover{
	background:url(images/botnavhover.png) no-repeat;
}

.navbar ul li:active{
	background:url(images/botnavhover.png) no-repeat;
}

.navbar ul li h4{
	height:26px;
	width:88px;
	padding:4px 0px 0px 0px;
	margin:auto;
	color:#000;
	text-align:center;
	font-size:14px;
}

.navbar ul li a{
/***ESTO FUE LO QUE AGREGUE A MI HOJA DE ESTILOS CSS***/
	display:block;
/******FIN******/
	width:88px;
	height:26px;
}

.navbar ul li h4 a:link{
	color:#000;
}

.navbar ul li h4 a:hover{
	color:#999 !important;
}

.navbar ul li h4 a:active{
	color:#fff !important;
}

.navbar ul li h4 a:visited{
	color:#000;
}

Muchas suerte a todos y gracias por la ayuda!