Foros del Web » Creando para Internet » CSS »

menu horizontal

Estas en el tema de menu horizontal en el foro de CSS en Foros del Web. Hola a todos me encuentro haciendo un menu horizontal con css en el cual ocupa todo el ancho de la pagina.. la lista tiene 4 ...
  #1 (permalink)  
Antiguo 24/07/2010, 10:33
Avatar de juan_14nob  
Fecha de Ingreso: abril-2010
Mensajes: 552
Antigüedad: 7 años, 7 meses
Puntos: 6
menu horizontal

Hola a todos me encuentro haciendo un menu horizontal con css en el cual ocupa todo el ancho de la pagina.. la lista tiene 4 elementos. "Home" "Servicios" "Presupuesto" "Contacto" cuando lo hago queda todo bien pero cuando le agrego la separacion para que no quede cada bloque uno alado de otro pegado "contacto" se me va hacia abajo
les dejo el codigo por si quieren verlo..
Saludos y gracias a aquel que intente ayudarme..
Código HTML:
<html>
<head>
<title>nada</title>
<style type="text/css" >
		#menuhori{
		position:realtive;
		font: 80% "Trebuchet MS", Arial, Helvetica, sans-serif;
		margin-top:20px;
		border: 1px solid #ACCFE8;
		width:1003px;
		height:25px;
		list-style: none;
		
		}
		#menuhori ul, li{
		list-style-type: none;

		}
		#menuhori ul {
		margin: 0px;
		padding: 0px;
		width:700px;
		}
		#menuhori li{
		margin-right:100px;
		float:left;
		width:100px;
		}	
		#menuhori a{
		display:block; 
		width:200px;
		padding:4px 0;
		text-decoration:none;
		text-align:center;
		font-size:11px;
		color:#FFFFFF;
		background-color:#B2B2B2;

		}
		#menuhori a:hover {
        background: #DBEBF6;
		}
</style>
</head>
<body>
<div id="contenedor" style="-moz-border-radius-topright: 10px;">

	

	

	<div id="menuhori" >
	<ul>
	<li><a href="#" id="pri">Home </a></li>
	<li><a href="#"> Servicios </a></li>
	<li><a href="#">Presupuesto</a></li>
	<li><a href="#">Contacto</a></li>
	</ul>
	</div>
		</div>
</body>
</html> 
  #2 (permalink)  
Antiguo 24/07/2010, 11:43
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: menu horizontal

Hola:

Según tu código cada enlace del menú tiene un ancho:

Cita:
Iniciado por juan_14nob Ver Mensaje
#menuhori a{
display:block;
width:200px;
padding:4px 0;
text-decoration:none;
text-align:center;
font-size:11px;
color:#FFFFFF;
background-color:#B2B2B2;

}
Si tenemos cuatro enlaces en el menú, el total de la lista debería medir 800px ¿no?

Cita:
Iniciado por juan_14nob Ver Mensaje
#menuhori ul {
margin: 0px;
padding: 0px;
width:700px;
}
Saludos.

  #3 (permalink)  
Antiguo 24/07/2010, 15:12
Avatar de juan_14nob  
Fecha de Ingreso: abril-2010
Mensajes: 552
Antigüedad: 7 años, 7 meses
Puntos: 6
Respuesta: menu horizontal

exacto, gracias por tu gran ayuda!!
Saludos!!

Etiquetas: horizontal
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 08:52.