Foros del Web » Creando para Internet » CSS »

Alinear la lista, no se que esta mal ...

Estas en el tema de Alinear la lista, no se que esta mal ... en el foro de CSS en Foros del Web. Hola amigos, No paro de revisar el código y no se donde está el error. Tengo un menú superior, y quiero centrarlo, pero por más ...
  #1 (permalink)  
Antiguo 18/10/2010, 13:45
 
Fecha de Ingreso: octubre-2010
Mensajes: 9
Antigüedad: 7 años, 2 meses
Puntos: 0
Alinear la lista, no se que esta mal ...

Hola amigos,

No paro de revisar el código y no se donde está el error.

Tengo un menú superior, y quiero centrarlo, pero por más que modifique no lo centra siempre esta alineado a la izquierda.

Alguien me puede echar un cable?

Este es el codigo HTML del menú:

Código:
body {
	background-color: #FFF;
}
</style>
</head>
<body style="color: #FFF">

<div id="wrapper-top">
		<div id="container-top">
			<div id="top">
				<a href="index.html"><img src="images/logo.png" alt="" /></a>
			</div><!-- end #top -->
			<div id="navtop">
			<ul id="topnav">
				<li id="home"><a class="current" href="index.html">inicio</a></li>
				<li><a href="about.html">squisit</a>
                <ul>
						<li><a href="#">This is Only</a></li>
						<li><a href="#">For Example</a></li>
						<li><a href="#">Dropdown Menu</a></li>
					</ul>
				</li>
				<li><a href="services.html">Services</a></li>
				<li><a href="packages.html">Packages</a></li>
				<li><a href="faq.html">Faq</a></li>
				<li><a href="contact.html">Contacto</a></li>
				
			</ul><!-- end #topnav -->
		  </div><!-- end #navtop -->
... y este el código CSS:

Código:
#wrapper-top{
	/* [disabled]background-image:url(../images/bg-wrapper.gif); */
	/* [disabled]background-repeat:repeat-x; */
	background-color:#fafafa;
	margin: 0 auto 0 auto;
	width: 996px;
	text-align: left;
}
#wrapper-bottom{background-color:#e9e9e9; min-height:390px;}
#container-top{
	margin:0 auto;
	width:996px;
	background-color: #FFF;
}
#container-bottom{margin:0 auto; width:990px;}



/* TOP */
#top{
	height:100px;
	text-align: center;
}W
#logo h1, #logo h1 a, #logo h1 a:visited{font-size:40px; color:#3d73a2; margin-bottom:0px;  padding:20px 0px 0px 40px; text-decoration:none; font-weight:normal; }
#logo h1 a:hover{text-decoration:none;}
#logo .desc{color:#7c7a6b; font-size:14px; padding-left:25px;}
#logo{width:320px; float:left;}

#navtop{
	/* [disabled]background-image:url(../images/bg-navtop.png); */
	background-repeat:no-repeat;
	background-position:top;
	height:60px;
	position:relative;
	z-index:100;
	text-align: center;
	margin: auto;
}


#topnav, #topnav ul{
	margin:0;
	padding:0;
	list-style-type:none;
	position:relative;
	line-height:1.5em; 
}
#topnav{
	padding:10px 13px 0px 13px;
	width: 732px;
}
#topnav a{
	display:block;
	padding:0px 0px;
	color:#323945;
	text-decoration:none;
	text-transform:uppercase;
	width:120px;
}

#topnav a.current{color:#3e4653; background-image:url(../images/bg-navlink.png); background-repeat:no-repeat; }

#topnav a:hover{
	background-image:url(../images/bg-navlink.gif); background-repeat:no-repeat; 
}

#topnav li a:hover {
	background-image:url(../images/bg-navlink.gif); background-repeat:no-repeat; 

}
#topnav li:hover a, 
#topnav li.sfHover a {
	background-image:url(../images/bg-navlink.png);
	background-repeat:no-repeat;
}
#topnav li:hover ul a:hover, 
#topnav li.sfHover ul a:hover {
	background-image:url(../images/bg-navlink.gif); background-repeat:no-repeat; 
}


#topnav li{
	float:left;
	position:relative;
	padding-left:0px;
	padding-right:0px;
	line-height:38px;
	padding-bottom:4px;
	padding-top:2px;
	font-size:12px;
	text-align:center;
	margin-right:2px;
	
	
}

#topnav li#home{background-image:none;}

#topnav li li{
	padding-right:0px;
	text-transform:capitalize;
	line-height:25px;
	padding:0px 0px;
	background-image:none;
}

#topnav ul {
	position:absolute;
	display:none;
	width:190px;
	top:3.3em;
	left:0px;
	background-color:#fff;
	padding-bottom:25px;
	border:solid 1px #d6fbd5;
	border-width:0px 1px 1px 1px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-bottomleft:5px;
	-webkit-border-bottom-left-radius:5px;
	-webkit-border-bottom-right-radius:5px;
}

#topnav li ul a{
	width:144px;
	height:auto;
	margin:0 13px;
	padding:3px 10px 0px 10px;
	text-transform:capitalize;
	border-bottom:solid 1px #f4f5f5;
	text-align:left;
	color:#a1a1a1
}

#topnav li ul a, #topnav li ul a:hover{background-image:none !important; }

#topnav li ul a:hover{}

#topnav ul ul{
	top:0px;
}	

#topnav li ul ul {
	left:12em;
	margin:0px 0 0 0px;
}

#topnav li:hover ul ul, #topnav li:hover ul ul ul, #topnav li:hover ul ul ul ul{
	display:none;
}
#topnav li:hover ul, #topnav li li:hover ul, #topnav li li li:hover ul, #topnav li li li li:hover ul{
	display:block;
}
Gracias de antemano!
  #2 (permalink)  
Antiguo 18/10/2010, 14:31
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: Alinear la lista, no se que esta mal ...

Hola:

Cita:
Iniciado por oskarmp Ver Mensaje
#topnav, #topnav ul{
margin:0;
padding:0;
list-style-type:none;
position:relative;
line-height:1.5em;
}
Le estás poniendo margin 0 al menú.

Saludos.

  #3 (permalink)  
Antiguo 19/10/2010, 01:57
 
Fecha de Ingreso: octubre-2010
Mensajes: 9
Antigüedad: 7 años, 2 meses
Puntos: 0
Respuesta: Alinear la lista, no se que esta mal ...

Muchisimas gracias por tu celeridad al responder y resolverme el problema.

Un Saludo!!

Etiquetas: alinear, lista, mal
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 16:43.