Foros del Web » Creando para Internet » HTML »

Ubicación correcta de etiquetas.

Estas en el tema de Ubicación correcta de etiquetas. en el foro de HTML en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 08/04/2012, 10:31
Avatar de Azer  
Fecha de Ingreso: abril-2012
Ubicación: Argentina
Mensajes: 13
Antigüedad: 7 años, 7 meses
Puntos: 0
Pregunta Ubicación correcta de etiquetas.

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!

Última edición por Azer; 08/04/2012 a las 13:49 Razón: El título estaba incorrecto y una parte de la explicación.
  #2 (permalink)  
Antiguo 08/04/2012, 16:08
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.566
Antigüedad: 11 años, 9 meses
Puntos: 1087
Respuesta: Ubicación correcta de etiquetas.

muestra tu CSS para ver el error, puedes probar colocar

.navbar li a{display:block;}
  #3 (permalink)  
Antiguo 08/04/2012, 18:17
Avatar de Azer  
Fecha de Ingreso: abril-2012
Ubicación: Argentina
Mensajes: 13
Antigüedad: 7 años, 7 meses
Puntos: 0
Respuesta: Ubicación correcta de etiquetas.

Cita:
Iniciado por Ag666 Ver Mensaje
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!

Última edición por Azer; 08/04/2012 a las 18:29

Etiquetas: correcta, enlaces, etiquetas, utilizacion
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:40.