Foros del Web » Creando para Internet » CSS »

Centrar Menu superior

Estas en el tema de Centrar Menu superior en el foro de CSS en Foros del Web. Hola pues tengo este codigo y no consigo centra los links (poner el texto en el centro), a ver si alguien me puede ayudar un ...
  #1 (permalink)  
Antiguo 13/03/2009, 06:13
 
Fecha de Ingreso: marzo-2009
Mensajes: 18
Antigüedad: 8 años, 8 meses
Puntos: 0
Centrar Menu superior

Hola pues tengo este codigo y no consigo centra los links (poner el texto en el centro), a ver si alguien me puede ayudar un poco! gracias :)

index.html:
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div class="red">
<div id="slatenav">
<ul>
<li><a href="aaa" title="css menus" class="current">Home</a></li>
<li><a href="aaa" title="css menus">About Us</a></li>
<li><a href="aaa" title="css menus">Services</a></li>
<li><a href="aaa" title="css menus">Our Work</a></li>
<li><a href="aaa" title="css menus">Contact Us</a></li>
</ul>
</div>
</div>
</body>
</html>

css:
.red #slatenav{
position:relative;
display:block;height:42px;
font-size:11px;
font-weight:bold;
background:transparent url(images/redslate_background.gif) repeat-x top left;
font-family:Arial,Verdana,Helvitica,sans-serif;
text-transform:uppercase;
}
.red #slatenav ul{
margin:0px;
padding:0;
list-style-type:none;
width:auto;
}

.red #slatenav ul li{
display:block;
float:left;
margin:0 1px 0 0;
}
.red #slatenav ul li a{
display:block;
float:left;
color:#FECCC3;
text-decoration:none;
padding:14px 22px 0 22px;
height:28px;
}
.red #slatenav ul li a:hover,.red #slatenav ul li a.current{
color:#fff;
background:transparent url(images/redslate_backgroundOVER.gif) no-repeat top center;
}

Si saco los float:left se me ponen en una lista vertical...

Muchas Gracias!
  #2 (permalink)  
Antiguo 13/03/2009, 07:34
Avatar de talmente  
Fecha de Ingreso: noviembre-2007
Mensajes: 233
Antigüedad: 10 años
Puntos: 4
Respuesta: Centrar Menu superior

Hola, no se si te refieres a esto:

Código:
.red #slatenav ul{
	margin:0px;
	padding:0;
	list-style-type:none;
	position: relative;
	left: 50%;
	float: left;
}

.red #slatenav ul li{
	display:block;
	float:left;
	margin:0 1px 0 0;
	position: relative;
	right: 50%;
}
  #3 (permalink)  
Antiguo 13/03/2009, 13:05
 
Fecha de Ingreso: marzo-2009
Mensajes: 18
Antigüedad: 8 años, 8 meses
Puntos: 0
Respuesta: Centrar Menu superior

Primero decir muchas gracias, i si es lo que quiero :) xo hay algun fallo :(

El problema es que de esta forma el <ul> me hace crecer la pagina (de ancho) (abriendo solo estos archivo no se ve, xo cuando pongo el menu en la web supera el ancho y me sale la barra de desplazamiento debajo.

Si lo habres con el firebug se ve muy bien. A ver si me podeis ayudar jeje

Gracias!
  #4 (permalink)  
Antiguo 14/03/2009, 04:20
Avatar de talmente  
Fecha de Ingreso: noviembre-2007
Mensajes: 233
Antigüedad: 10 años
Puntos: 4
Respuesta: Centrar Menu superior

Dale un tamaño a ul y despues ajustas la pasición que yo le di a ul left: 50%;
y a ul li right: 50%; o pon algo más de codigo.
  #5 (permalink)  
Antiguo 14/03/2009, 07:46
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: Centrar Menu superior

Cita:
Iniciado por Neox Ver Mensaje
Si lo habres con el firebug se ve muy bien. A ver si me podeis ayudar jeje
Hola:

Lo abriría con el firebug si indicaras por lo menos tu url ¿no crees?

Saludos.

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 22:03.