Foros del Web » Creando para Internet » CSS »

Diseño de menús

Estas en el tema de Diseño de menús en el foro de CSS en Foros del Web. Buenas, Me gustaría saber cuál es la mejor manera de hacer un menú con CSS. Tenía entendido que con el uso de las listas (con ...
  #1 (permalink)  
Antiguo 21/06/2011, 14:26
danihxh
Invitado
 
Mensajes: n/a
Puntos:
Diseño de menús

Buenas,

Me gustaría saber cuál es la mejor manera de hacer un menú con CSS. Tenía entendido que con el uso de las listas (con estilos para que tomen forma de menú horizontal, sin viñetas, etc), ya que un menú al fin y al cabo es lo que es.

El problema es que los elementos <li> con este estilo alineados a la izquierda dejan un pequeño margen. El código es éste:

Código:
<html>

<head>

<style>
.a
{
	width: 80%;
	height: 20px;
	background-color: #AAAAAA;
 	margin-left: auto;
 	margin-right: auto; 
	border: 1px solid;
	list-style-type: none; 
}

.c
{
	width: 100px;
	height: 20px;
	background-color: #00FF00;
	float:left;
	margin-left: -40px;
}

</style>

</head>

<body>
	<menu class="a">
		<li class="c">8</div>
	</menu>
</body>

</html>
La única solución que he encontrado es poner un margin-left: -40, pero no me acaba de convencer porque a lo mejor entre diferentes navegadores o versiones no funciona igual...

Alguna idea? Cómo soléis hacer vosotros los menús?
  #2 (permalink)  
Antiguo 22/06/2011, 12:11
 
Fecha de Ingreso: abril-2011
Ubicación: Distrito Federal
Mensajes: 83
Antigüedad: 6 años, 3 meses
Puntos: 9
Respuesta: Diseño de menús

Todas las listas (etiquetas ul) tienen un padding por default de 20 px me parece del lado izquierdo.

Te recomiendo primero poner un id a la lista y utilizar el siguiente estilo:
Código CSS:
Ver original
  1. ul.nav{
  2.     margin:0;
  3.     padding:0;
  4.     list-style: none;
  5. }

Esto quita ese margen que comentas.
  #3 (permalink)  
Antiguo 22/06/2011, 12:38
 
Fecha de Ingreso: mayo-2011
Mensajes: 11
Antigüedad: 6 años, 2 meses
Puntos: 1
Respuesta: Diseño de menús

Te recomiendo que implementes uno de estos ejemplos:
http://www.alistapart.com/articles/dropdowns

Hay unos muysencillos, para lo basico.

Salu2!

Última edición por estuardolh; 22/06/2011 a las 12:40 Razón: texto sin vinculo
  #4 (permalink)  
Antiguo 22/06/2011, 14:35
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 1 mes
Puntos: 269
Respuesta: Diseño de menús

En desplegables, esto es muy bueno. Los estoy usando y van 10 puntos, luego los personalizas a tu gusto.

Saludos.

Etiquetas: espacio, listas, margen, menú
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 00:35.