tengo un menu de un ancho determinado. Ese menu tiene X items. Mi objetivo es que la primera letra del primer item coincida con el inicio del <div id="menu"> y que la ultima letra del ultimo item coincida con el final del div.
Hasta ahora lo hacia con margenes entre los items. Pero si necesitara incluir otro item a la lista(lo cual es muy probable), esto deja de funcionar ya que las medidas cambian.
Entonces se me ocurrio justificar el texto, para que siempre ocupara todo el div, sin importar si hay 4 o 6 items.
El problema es que no me queda justificado. El html es de la siguiente forma:
Código HTML:
<div id="menu_items">
<a href="#">La empresa</a>
<a href="#">Servicios</a>
<a href="#">Trabajos</a>
<a href="#">Contacto</a>
<a href="#">Varios</a>
</div>
Código:
#menu_items {
margin-left:115px;
margin-top:89px;
width:543px;
float:left;
padding-bottom:25px;
border-bottom:1px #a3a0a9 solid;
text-align:justify;
}
puse todo el CSS de menu_items por si tal vez alguna propiedad este afectando al text-align.
alguien me ayuda a justificar esto? o lograr el mismo efecto de alguna otra menera.
pd: pregunte por ULs ya que antes de poner los <a> todo seguidos, estaban ordenados en una ul (en la cual el "text-align:justify" tampoco funcionaba)