centrar menu de www.13styles.com ???

[chocovo]

Hola a todos,

He buscado en www.13styles.com un menu para mejorar mi web, queda bonito pero no consigo que se centre en la pagina.

Al final, poniendo padding:0 0 0 235px, he conseguido que se centre cuando la pantalla esta en 1024px pero no cuando la pantalla no esta maximizada o con otra resolucion.

Alguien me puede ayudar con el codigo?
A proposito, que significa la lista de numeros padding:0 0 0 235px?

El codigo es el siguiente:

/* ---------------------- Dolphin nav ---------------------- */
#dolphincontainer{position:absolute;left:50%;margi n-left:-501px;height:33px;width:1002px;color:#E0E0E0;backg round:#143D55;font-family:Helvetica,Arial,Verdana,sans-serif;}
#dolphinnav{position:relative;height:33px;font-size:12px;text-transform:uppercase;font-weight:bold;background:#143D55 url(../image/dolphin_bg.gif) repeat-x bottom left;padding:0 0 0 235px;}
#dolphinnav ul{margin:0;padding:0;list-style-type:none;width:auto;float:left;}
#dolphinnav ul li{display:block;float:left;margin:0 1px;}
#dolphinnav ul li a{display:block;float:left;color:#EAF3F8;text-decoration:none;padding:0 0 0 20px;height:33px;}
#dolphinnav ul li a span{padding:12px 20px 0 0;height:21px;float:left;}
#dolphinnav ul li a:hover{color:#fff;background:transparent url(../image/dolphin_bg-OVER.gif) repeat-x bottom left;}
#dolphinnav ul li a:hover span{display:block;width:auto;cursor:pointer;}
#dolphinnav ul li a.current,#dolphinnav ul li a.current:hover{color:#fff;background:#1D6893 url(../image/dolphin_left-ON.gif) no-repeat top left;line-height:275%;}
#dolphinnav ul li a.current span{display:block;padding:0 20px 0 0;width:auto;background:#1D6893 url(../image/dolphin_right-ON.gif) no-repeat top right;height:33px;}
/* ---------------------- END Dolphin nav ---------------------- */

Gracias
Chocovo

[DragonX]

Probá con esto:


#dolphinnav{
position:relative;
height:33px;
font-size:12px;
text-transform:uppercase;
font-weight:bold;
background:#143D55 url(../image/dolphin_bg.gif) repeat-x bottom left;
/*padding:0 0 0 235px;*/
margin:0 auto;
}

[chocovo]

Hola DragonX,

Con ese cambio lo que ocurre es que me pone el menu a la izquierda.
La barra de menu ocupa todo el ancho de la pantalla pero el texto del menu a la izquierda y lo quisiera centrado.

De todas formas, muchas gracias
Chocovo

[kseso?]

A ver si dándole a #dolphincontainer{margin 0 auto;} acertamos

A proposito, que significa la lista de numeros padding:0 0 0 235px

El espacio entre el contenido de ese elemento y sus límites. Una especie de sangría interior o márgenes internos.
El orden es: arriba, derecha, abajo, izquierda

[Aresillo]

Que es mejor poner:

Código:

padding:0 0 0 235px

ó

Código:

padding-left:235px

¿??

Aresillo!!

[ssclamp]

Para que te funcione bien el "margin:0 auto;" que te propone DragonX tienes que colocar adecuadamente el doctype, porque no funciona en modo quirks.

Saludos

[Mikmoro]

Iniciado por ssclamp

Para que te funcione bien el "margin:0 auto;" que te propone DragonX tienes que colocar adecuadamente el doctype, porque no funciona en modo quirks.

Saludos

Pero aparte el margin 0 auto no puede funcionar puesto que esa caja no tiene ancho definido, por lo que está obligada a ocupar el 100%, de manera que no es posible centrarla. Otra cosa es su contenido, que si son elementos de línea se centran poniéndole a la caja text-align: center.

Esta es la manera más simple de centrar un menú:

HTML

<div id="menu">
<ul>
<li><a href="#">INDEX</a></li>
<li><a href="#">VIEW</a></li>
<li><a href="#">INSERT</a></li>
<li><a href="#">REGISTER</a></li>
</ul>
</div>

CSS

* {margin: 0;padding: 0;}

#menu {margin: 0 auto;
width: 700px;
height: 35px;
text-align: center;
}
ul {list-style-type: none;
border: solid 1px #f00;
}
li {padding: 0 29px;
display: inline;
text-align: center;
}
a {line-height: 35px;}

Aquí un ejemplo

[ssclamp]

Más claro, sólo el agua... y con ejemplo y todo!

Gracias, viejo.

Saludos

[chocovo]

Hola a todos,

Muy interesante el codigo del menu, pero nos hemos alejado del codigo original de www.13styles.com y de los fondos de los botones.

De todas formas, muchas gracias
Chocovo

[Mikmoro]

mmm... no entiendo eso de "alejarnos del menú de...". Que yo sepa, tu consulta era esta:

Iniciado por chocovo

He buscado en www.13styles.com un menu para mejorar mi web, queda bonito pero no consigo que se centre en la pagina.

Y obviamente la respuesta es cómo centrar un menú, no cómo centrar tu menú, que a demás no sabemos cuál has elegido.

¿Con la información que te hemos dado serías capaz de centrar tu menú?

Si no es así, concreta tu consulta.