Foros del Web » Creando para Internet » CSS »

Listas/menu/espacios

Estas en el tema de Listas/menu/espacios en el foro de CSS en Foros del Web. Hola todos, Tengo un inconveniente con las listas. Estoy haciendo un menú horizontal y quiero ponerle un marco alreadedor. Puse una lista y afuera puse ...
  #1 (permalink)  
Antiguo 14/04/2005, 23:47
 
Fecha de Ingreso: abril-2003
Mensajes: 150
Antigüedad: 14 años, 8 meses
Puntos: 1
Listas/menu/espacios

Hola todos,

Tengo un inconveniente con las listas. Estoy haciendo un menú horizontal y quiero ponerle un marco alreadedor. Puse una lista y afuera puse un div con borde para que me mostrara el marco. Pero al parecer las listas generan un padding bastante amplio, en Firefox no se ve tan mal, pero en IE se ve demasiada ancha la separación. Esto es lo que tengo:

Código HTML:
<div class="divmainmenu">
    <ul id="navlist">
       <li><a href="#">PRODUCT INFO</a></li>
       <li><a href="#">CORPORATE</a></li>
       <li><a href="#">DEVELOPERS</a></li>
       <li><a href="#">DESIGNERS</a></li>
       <li><a href="#">SUPPORT</a></li>
     </ul>
</div> 
Código:
/* main menu */
	.divmainmenu {
		padding-left: 5px;
		border: 1px solid #999;
		font-size:10px;
		color:#999999;
		text-align:center;
	}
	ul#navlist
	{
		margin-left: 0;
		padding-left: 0;
		white-space: nowrap;
	}
	#navlist li
	{
		display: inline;
		list-style-type: none;
	}
	#navlist a { padding: 3px 15px; }
	#navlist a:link, #navlist a:visited
	{
		color: #999;
		background-color: #fff;
		text-decoration: none;
	}
	#navlist a:hover
	{
		color: #2D3258;
		background-color: #46D7FB;
		text-decoration: none;
	}
	/* end main menu */
Y lo que me genera es:

En IE


Y en Firefox:


Mi pregunta es: Las listas de por sí crean ese padding o separación tan ancha? o me falta agregar algo o me sobra algo?

Les agradezco sus comentarios, porque ya no sé que mas arreglarle..

Saludos,
Liz
  #2 (permalink)  
Antiguo 15/04/2005, 02:11
Avatar de kemie  
Fecha de Ingreso: junio-2003
Ubicación: estocolmo<-->mexico
Mensajes: 1.627
Antigüedad: 14 años, 5 meses
Puntos: 1
intenta:
#navlist li
{ margin:0;
padding:0;
display: inline;
list-style-type: none;
}

si no funciona, intenta agregar margenes de colores a todos tus elementos para ver exactamente donde esta el espacio extra, si en el ul, el li, o el link
__________________
::::::::::::::::::::::::::::: WebHostNinja | diseñorama.com::::::::::::::::::::::::::::::
  #3 (permalink)  
Antiguo 15/04/2005, 22:15
 
Fecha de Ingreso: abril-2003
Mensajes: 150
Antigüedad: 14 años, 8 meses
Puntos: 1
Gracias keime!!!

Bueno, no era eso pero por ahí cerca. Le puse margin-top y margin-bottom y se me corrieron como las necesitaba

Agregué lo que me dijiste y esto:
ul#navlist
{
margin-top: 7px;
margin-bottom: 7px;
margin-left: 0;
padding-left: 0;
white-space: nowrap;
}

Gracias por tu comentario!!
Liz
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 17:30.