Problema con código de menú

AEP · #1 (**permalink**) 20/02/2009, 16:50

Estoy haciendo un sitio web, y soy nuevo en esto digamos.
Tengo este código, pero los links los quiero centrados, cómo puedo hacer?, o qué estoy haciendo mal?.

Código:

#menu {
  width: 100%;
  height: 42px;
  background: #663333 url(../img/nav.gif) repeat-x; 
  font-size:130%;	
}
  	    
ul.menu {
  clear: both;
  text-align: center;
  width: 750px;
  list-style: none;
  margin: 0;
  padding: 0;
}
ul.menu li {
 float: left;
 text-align: center;
}
ul.menu li a:link, ul.menu li a:visited {
  padding: .9em;
  display: block;
  text-decoration: none;
  color: #333;
}

willyfc · #2 (**permalink**) 20/02/2009, 17:50

has estos cambios: si quieres que una lista se ve horizontal no debes hacerla flotar hay una propiedad para eso:

Código:

ul.menu li {
display:inline;
}

si tienes un doctype correcto para que se centre solo hace falta poner el margin así

Código:

ul.menu {
  margin:0 auto;
  width: 750px;
  list-style: none;
  padding: 0;
  text-align:center;}

esto hara que centre

AEP · #3 (**permalink**) 20/02/2009, 18:06

Gracias por la respuesta willyfc.
El menú ahora, queda centrado, pero verticalmente. Hice lo que me habías dicho.

willyfc · #4 (**permalink**) 20/02/2009, 18:10

no entiendo, te funciono, es lo que querías?

AEP · #5 (**permalink**) 20/02/2009, 18:24

Si, el menú quedó centrado, pero tenía los links uno al lado de otro. Ahora me quedó uno abajo de otro.

willyfc · #6 (**permalink**) 20/02/2009, 18:27

Cita:

Iniciado por AEP

Si, el menú quedó centrado, pero tenía los links uno al lado de otro. Ahora me quedó uno abajo de otro.

ahhh, jeje, disculpa no me dí cuenta, lo que pasa es que tienes en la declaración de vínculos

Código:

ul.menu li a:link, ul.menu li a:visited {
display:block;
  padding: .9em;
  text-decoration: none;
  color: #333;
}

quita el display:block

AEP · #7 (**permalink**) 20/02/2009, 18:42

Problema solucionado, muchas gracias por tu ayuda willyfc.

Saludos.