Foros del Web

Foros del Web (http://www.forosdelweb.com/)
-   CSS (http://www.forosdelweb.com/f53/)
-   -   menu horizontal centrado en div (http://www.forosdelweb.com/f53/menu-horizontal-centrado-div-451007/)

seterek 19/12/2006 05:30
menu horizontal centrado en div
 
hola,
cómo puedo hacer para que un menú horizontal hecho con listas y con float:left quede centrado horizontalmente en una div? me obliga el float left a que quede alineado a la izquierda? he estado buscando por ahí pero no veo nada,
muchas gracias

bhagat 19/12/2006 06:09
Re: menu horizontal centrado en div
 
intenta usando
margin:auto;
suele funcionar

de todos modos si envias el CSS completo y mejor aun la página web, es mas facil poder indicarte posibles soluciones.
:-)

seterek 19/12/2006 06:27
Re: menu horizontal centrado en div
 
margin: 0 auto no funciona porque el float left creo que no deja, he probado con padding y margin y funciona pero si cambias a 800x600 pues ya no sirve, claro.

Fix3r 19/12/2006 10:20
Re: menu horizontal centrado en div
 
Yo lo hago con una etiqueta de <center> antes del div y después de el /div. A ti te sirve?

AlZuwaga 19/12/2006 10:46
Re: menu horizontal centrado en div
 
margin: 0 auto; debería funcionar sólo si tu ul tiene un ancho establecido. Al ser un elemento en bloque, este va a ocupar todo el ancho disponible para él y el centrado no se va a notar. Seguro exista otra solución, pero la desconozco.

Mikmoro 19/12/2006 11:46
Re: menu horizontal centrado en div
 
Ese menú con listas seguramente estará en un contenedor. Entonces, a ese contenedor añádele text-align: center, y luego a las listas, display: inline. Se te centrarán dentro del contenedor, que seguramente él mismo ya estaría centrado con margin 0 auto como te han dicho.

Mikel.

AlZuwaga 19/12/2006 11:49
Re: menu horizontal centrado en div
 
Efectivamente, la clave está en display:inline en vez de floats.
Estaba justo probándolo:


Código:
ul {
list-style-type: none;
margin: 0 auto;
padding: 0;
text-align: center;
background-color: #006600;
}

div {
background-color: #000000;
padding: 10px;
}

li {
display: inline;
background-color: #FF9900;
padding: 5px;
margin: 1px;
}


<div>
<ul>
<li>elemento 1</li>
<li>elemento 2</li>
<li>elemento 3</li>
</ul>
</div>

seterek 19/12/2006 14:30
Re: menu horizontal centrado en div
 
joer, perfecto!! muchas gracias! la verdad es que me estaba empecinando con el float left, era algo "como que no lo podía quitar, que tenía que ir por narices", ya ves tú... en fin, que muchas gracias de nuevo!


La zona horaria es GMT -6. Ahora son las 20:33.

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2026, Jelsoft Enterprises Ltd.