Foros del Web » Creando para Internet » CSS »

es posible justificar un conjunto de <a>? o una UL?

Estas en el tema de es posible justificar un conjunto de <a>? o una UL? en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 23/03/2009, 13:11
 
Fecha de Ingreso: febrero-2009
Mensajes: 225
Antigüedad: 8 años, 9 meses
Puntos: 4
es posible justificar un conjunto de <a>? o una UL?

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)

Última edición por Newbie001; 04/04/2009 a las 06:27
  #2 (permalink)  
Antiguo 23/03/2009, 14:38
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Respuesta: es posible justificar un conjunto de <a>? o una UL?

Creo que deberás poner un ejemplo de lo que quieres para poder ayudarte... Una imagen a lapiz escaneada serviría.

Saludos
__________________
Al final del día hablar es gratis, codificar no lo es
  #3 (permalink)  
Antiguo 23/03/2009, 16:04
 
Fecha de Ingreso: febrero-2009
Mensajes: 225
Antigüedad: 8 años, 9 meses
Puntos: 4
Respuesta: es posible justificar un conjunto de <a>? o una UL?

hola, aca esta:

Tengo esto:



Y quiero esto:
  #4 (permalink)  
Antiguo 23/03/2009, 16:41
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Respuesta: es posible justificar un conjunto de <a>? o una UL?

Código:
text-align: justify;
Alínea tu texto a la derecha y a la izquierda del párrafo, pero para una sóla línea no sirve puesto que sólo justifica cuando el texto pasa de 1 línea, y si hubieran 2, 10, 100 o más líneas, la última línea estaría alineada a la izquierda.

Para lo que necesitas, intenta como lo has estado haciendo y sí en un futuro hay más items, pues te tocaría cambiar lo que tienes (en un futuro).

Saludos
__________________
Al final del día hablar es gratis, codificar no lo es
  #5 (permalink)  
Antiguo 23/03/2009, 16:47
 
Fecha de Ingreso: febrero-2009
Mensajes: 225
Antigüedad: 8 años, 9 meses
Puntos: 4
Respuesta: es posible justificar un conjunto de <a>? o una UL?

no puedo hacer eso. si existen nuevos links los van a agregar personas ajenas al codigo y sin conocimientos tecnicos a partir de un cms
  #6 (permalink)  
Antiguo 23/03/2009, 17:03
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: es posible justificar un conjunto de <a>? o una UL?

Hola:

Mira esta página a ver si te sirve de algo.

Saludos.

  #7 (permalink)  
Antiguo 23/03/2009, 17:50
Avatar de josdelaranda  
Fecha de Ingreso: abril-2007
Ubicación: Vivo en Lima - Perú
Mensajes: 61
Antigüedad: 10 años, 7 meses
Puntos: 0
Respuesta: es posible justificar un conjunto de <a>? o una UL?

Hola Newbie001

Tal vez te sirvan algunos de estos links

http://www.pmob.co.uk/temp/centred-float4.htm

http://css-tricks.com/examples/EquidistantObjectsSM/

Saludos
  #8 (permalink)  
Antiguo 23/03/2009, 20:07
 
Fecha de Ingreso: febrero-2009
Mensajes: 225
Antigüedad: 8 años, 9 meses
Puntos: 4
Respuesta: es posible justificar un conjunto de <a>? o una UL?

Cita:
Iniciado por jomaruro Ver Mensaje
Hola:

Mira esta página a ver si te sirve de algo.

Saludos.

como no me fije en araudi muchas gracias. aunque no me sirve en este caso. usa padding de 29 para separar los links, que era lo q hacia yo en un principio.
El tema es que si agregara un nuevo link, gracias al padding, el menu se agrandaria. Y preciso que quede igual

Cita:
Iniciado por josdelaranda Ver Mensaje
Hola Newbie001

Tal vez te sirvan algunos de estos links

http://www.pmob.co.uk/temp/centred-float4.htm

http://css-tricks.com/examples/EquidistantObjectsSM/

Saludos
muchas gracias vos tambien pero ninguna me funciono.



cierren este tema por favor, me gustaria abrir otro con diferente titulo ya que el problema "cambio"

Última edición por Newbie001; 23/03/2009 a las 20:20
  #9 (permalink)  
Antiguo 24/03/2009, 09:28
Avatar de Dalvenjha  
Fecha de Ingreso: febrero-2008
Ubicación: $("#oficina");
Mensajes: 692
Antigüedad: 9 años, 9 meses
Puntos: 53
Respuesta: es posible justificar un conjunto de <a>? o una UL?

-.- quieres mantener cierta distancia entre los items? entonces dale un display:block a los elementos "li" luego dentro de ellos puedes darle un text-align:center; con eso los mantendrá centrados.

Uhmmm veo que tu problema es el aumento de items en el menú, pero si vamos por lo seguro, es que si alguien puede aumentar items a tontas y locas entonces seguro que también podrá aumentar demasiados.

Una solución podría ser que des un margin-left entre los elementos "li" dándole al "ul" un display:block y aplicandole un text-align:center; asi los items que van entrando se acomodan. Claro, como te dije, si alguien se pasa de la raya entonces de todas maneras puede hacer que hayan demasiados elementos.

Saludos!!

Código CSS:
Ver original
  1. ul{
  2. display:block;
  3. width:900px (digamos que esa es tu medida);
  4. height:20px;
  5. overflow:hidden;
  6. text-align:center;
  7. }
  8.  
  9. ul li{
  10. margin-left:5px;
  11. }


Uhmmm tu problema te lo resuelvo con JS si no me crucifican aqui xD.


Primero, pensemos que tu div tiene un tamaño fijo, digamos que es de 900 px, luego la lista tiene un id digamos que es "lista". Ok comenzamos

Código javascript:
Ver original
  1. tamano = 900; (Tamano de tu men&#250;)
  2.  
  3. function comodar(){
  4. var elemento = document.getElementById('lista').getElementsByTagName('li'); (Cogemos todos los elementos li)
  5. var numero = elemento.length; (Contamos los elementos)
  6. var tamanoelemento = tamano/numero; (dividimos tamano entre numero de elementos)
  7. elemento.style.width = tamanoelemento + "px"; (el resultado ser&#225; el tama&#241;o de los elementos li)
  8. }
  9.  
  10. }

Para esto ya deberías haber definido en tu css que:

Código css:
Ver original
  1. li{
  2. display:block;
  3. width:0;
  4. height:20px; (Numero que quieras)
  5. text-align:center;
  6. }



Creo que es una opción, ve si te acomoda.
__________________
Mi Showcase ||

Compartiendo todo lo posible con los demás.

Última edición por Dalvenjha; 24/03/2009 a las 09:45
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 21:35.