alinear horizontalmente enlaces

[vitogq]

Hola tengo un menu horizontal con varios enlaces, lo ideal seria poder justificarlos horizontalmente para que tengan el mismo espacio entre todos los enlaces, he probado con text-align:justify, pero no funciona, el numero de enlaces no es fijo, este menu es secundario y en funcion de la opcion del menu primario hay diferentes opciones.

Ej. codigo:

Código:

<div style:"text-align:justify">
<a href="enlace1.php>Enlace 1</a>&nbsp;&nbsp;&nbsp;
<a href="enlace2.php>Enlace 2</a>&nbsp;&nbsp;&nbsp;
<a href="enlace3.php>Enlace 3</a>&nbsp;&nbsp;&nbsp;
<a href="enlace4.php>Enlace 4</a></div>

Código:

A mi me sale
Enlace 1  Enlace 2   Enlace 3   Enlace 4

Y me gustaria:
Enlace 1               Enlace 2            Enlace 3        Enlace 4

Un saludo

[Aresillo]

mete todos lo enlaces en una lista y después dale al ul el 100% del ancho...

Creo que era así...

Aresillo!!

[Calizman]

Coincido en la opinion de mi compañero Aresillo solo que le agregare algo y es esto:

-Metes todo en una lista ordenada
-al ul le das display: block y el 100% del ancho.
-al li le das display: inline o text-align: left o right tendra el mismo resultado...
-al li le das padding: auto 15px, esto te hara que de arriba no tenga padding, y de los lados tenga 15px de padding... asi se separaran los enlaces unos de otros!

Pruebalo... y haz tu tambien tu codigo no? ve cambiando el padding y cosas asi...

Suerte y Saludos!!

[vitogq]

Estoy probando las soluciones propuestas pero no me dan el resultado que deseo,lo que necesito es que ocupen el 100% del espacio estando la primera opcion a las izq y la ultima a la derecha y las que queden en medio que esten ocupando el espacio que queda en medio, al igual que una justificacion

[Calizman]

No entendi tu problema... podrias explicarte mejor?
y ante todo... poner el codigo CSS que estas poniendo! y el HTML!!

Gracias!

[juanota]

Yo lo hago al revés: al ul le dices mostrar bloque, y al li, mostrar línea, luego , le pones a li: margen auto y a ul: ancho 100%
Suerte

[yosoyraro]

prueba de poner float: left

[juanota]

Perdón, me equivoqué:
ul: mostrar línea,
li: mostrar bloque, float left (o right)
y le pones el margen izuierdo y derecho que necesites para separarlos (y padding, color de fondo, etc)

[willyfc]

creo que sería de esta manera:

Código:

#menu{ width:100%; height:40px; margin:0 auto;}
#menu ul{list-style:none}
#menu ul li{display:inline; margin:0 45px 0 45px}

Código HTML:

<div id="menu">
	<ul>
		<li><a href="#">menu 1</a></li>
		<li><a href="#">menu 2</a></li>
		<li><a href="#">menu 3</a></li>
		<li><a href="#">menu 4</a></li>
		<li><a href="#">menu 5</a></li>
		<li><a href="#">menu 6</a></li>
	</ul>
</div> 

[vitogq]

Muchas gracias willyfc

Ya sale bien...

[Calizman]

Valla... algo tan sencillo que gran problema se ha vuelto!

Gracias por el aporte Willyfc!!