Re: [Ovillo] Ajustar lista al ancho del contenedor

2010-04-19 Por tema Ramón Corominas
Aunque el menú sea dinámico, supongo que lo escribes sabiendo cuántas 
opciones tienes, así que siempre puedes poner la mayor parte de los 
estilos en la hoja externa y algunos sobreescribirlos con el atributo 
style. Esto puede sonar a feo porque se separa peor el código HTML de 
la presentación, pero es que para eso está precisamente el atributo 
style (y de todos modos la separación está ahí, no hay más que 
desactivar los estilos para ver que los style tampoco se aplican).

En la hoja de estilos pondrías todas las propiedades comunes, y en el 
style el ancho calculado en función del número de opciones que hay:

ul ...
  li style=width: 16.6%!important;../li
  li style=width: 16.6%!important;../li
  ...
/ul

Saludín,
Ramón.
 
Rafa escribió:
 El problema es el menú será dinámico por lo que en ocasiones
 pueden aparecer 6 elementos en el menú pero otras veces pueden
 aparecer 8, 10, 5...
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Ajustar lista al ancho del contenedor

2010-04-15 Por tema Luis Mario Álvarez
Si el contenedor padre tiene definido su ancho, basta con hacer width:
100%;al tag que necesitas lo llene.
Te recomendaría además que quites esos estilos de tu ul y los metas en
algúna hoja css. No es necesario que le asignes clase o id, basta con #navbar
ul {overflow:hidden ;border:1px solid #000;}

Saludos!

2010/4/15 Rafa Artacho teme...@gmail.com

 Buenas tardes:

 Tengo un menú que será dinámico y que dependiendo de las necesidades
 contendrá un número variable de elementos. Necesitaría que la lista se
 adaptase al ancho del div contenedor (974px). El HTML del menú con 6
 opciones:

div id=navbar
ul style=overflow:hidden;border:1px solid #000;
liInicio/li
liPelículas/li
liMúsica/li
liTeatro/li
liExposiciones/li
liCoches/li
/ul
/div


 ¿Sería posible hacer esto solamente con CSS o sería necesario usar JS?
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo




-- 
mario álvarez
desarrollador web
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Ajustar lista al ancho del contenedor

2010-04-15 Por tema Carlos Acero Sánchez

Prueba a dividir el número de elementos li entre 100 y se le aplicas:

100/6 = 16.6

#navbar ul li
{
float:left;
font-size:1.2em;
color:#00FF00;
padding:0 5px 0 10px;
border-right:1px solid #000;
text-align:right;
width:16.6%
}


Carlos Acero Sánchez
Dpto. Sistemas
Aguirre Newman Madrid

C/ General Lacy, 23. 28045 Madrid
T +31 91 319 13 14 F +34 91 319 87 57
carlos.ac...@aguirrenewman.es
www.aguirrenewman.com
Sé ecológico, antes de imprimir este e-mail piense bien si es necesario hacerlo



-Mensaje original-
De: ovillo-boun...@lists.ovillo.org [mailto:ovillo-boun...@lists.ovillo.org] En 
nombre de Rafa Artacho
Enviado el: jueves, 15 de abril de 2010 17:27
Para: Ovillo, la lista de CSS en castellano
Asunto: [Correo sospechoso] Re: [Ovillo] Ajustar lista al ancho del contenedor

He probado así:

#navbar{color:#FF;width:974px;}
#navbar ul{width:100%;}
#navbar ul li{float:left;font-size:1.2em;color:#00FF00;padding:0 5px 0
10px;border-right:1px solid #000;text-align:right;}

De este modo el ul queda extendido hasta el 100% del div #navbar, pero los
li no se ajustan al 100% del ul. Si pongo 100% al li ocupa cada li el 100%
del div #navbar. ¿Dónde sería el error?

El style lo puse para ver visualmente hasta dónde se extendía el contenedor,
cuando termine las pruebas lo quitaría.

Gracias!


2010/4/15 Luis Mario Álvarez mag...@magrio.net

 Si el contenedor padre tiene definido su ancho, basta con hacer width:
 100%;al tag que necesitas lo llene.
 Te recomendaría además que quites esos estilos de tu ul y los metas en
 algúna hoja css. No es necesario que le asignes clase o id, basta con
 #navbar
 ul {overflow:hidden ;border:1px solid #000;}

 Saludos!

 2010/4/15 Rafa Artacho teme...@gmail.com

  Buenas tardes:
 
  Tengo un menú que será dinámico y que dependiendo de las necesidades
  contendrá un número variable de elementos. Necesitaría que la lista se
  adaptase al ancho del div contenedor (974px). El HTML del menú con 6
  opciones:
 
 div id=navbar
 ul style=overflow:hidden;border:1px solid #000;
 liInicio/li
 liPelículas/li
 liMúsica/li
 liTeatro/li
 liExposiciones/li
 liCoches/li
 /ul
 /div
 
 
  ¿Sería posible hacer esto solamente con CSS o sería necesario usar JS?
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 



 --
 mario álvarez
 desarrollador web
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo

En cumplimiento de la Ley 15/1999, de 13 de diciembre, de Protección de Datos 
de Carácter Personal, le informamos que los datos de carácter personal 
utilizados para la presente comunicación proceden de un fichero de datos de 
carácter personal titularidad de Aguirre Newman, S.A., debidamente notificado 
ante la Agencia Española de Protección de Datos, cuya finalidad es la gestión 
(control, mantenimiento y archivo de la documentación) de la relación que 
mantiene con el GRUPO AGUIRRE NEWMAN y la comunicación con terceros. Dichos 
datos, por consiguiente, han sido incorporados o serán incorporados en dicho 
fichero para los usos y finalidades indicadas, pudiendo ser objeto de 
comunicación a las Compañías que integran el GRUPO AGUIRRE NEWMAN, cuya 
identidad podrá consultar en el aviso legal de la página web corporativa 
www.aguirrenewman.es, cuando sea necesario y/o pertinente para el cumplimiento 
de las finalidades señaladas. 
Si Ud. no consintiese la utilización del correo electrónico para enviarle 
comunicaciones electrónicas,  la comunicación de sus datos de contacto al resto 
de empresas del GRUPO AGUIRRE NEWMAN o deseara revocar su consentimiento al 
tratamiento de sus datos, podrá hacerlo mediante un correo electrónico dirigido 
a asesoriajurid...@aguirrenewman.es. Asimismo, si Ud. desea ejercitar sus 
derechos de acceso, rectificación, cancelación y oposición podrá hacerlo 
dirigiéndose por escrito al Departamento de Asesoría Jurídica de Aguirre 
Newman, S.A., calle General Lacy número 23, C.P. 28045 Madrid, remitiendo, 
junto con la solicitud, una fotocopia de un documento oficial de identificación 
(DNI, Pasaporte, etc).


According

Re: [Ovillo] Ajustar lista al ancho del contenedor

2010-04-15 Por tema Rafa Artacho
El problema es el menú será dinámico por lo que en ocasiones pueden aparecer
6 elementos en el menú pero otras veces pueden aparecer 8, 10, 5...

Con JS se puede lo que quería saber es si se puede hacer únicamente con CSS.

Gracias!


2010/4/15 Carlos Acero Sánchez carlos.ac...@aguirrenewman.es


 Prueba a dividir el número de elementos li entre 100 y se le aplicas:

 100/6 = 16.6

 #navbar ul li
 {
 float:left;
 font-size:1.2em;
 color:#00FF00;
 padding:0 5px 0 10px;
 border-right:1px solid #000;
 text-align:right;
 width:16.6%
 }


 Carlos Acero Sánchez
 Dpto. Sistemas
 Aguirre Newman Madrid

 C/ General Lacy, 23. 28045 Madrid
 T +31 91 319 13 14 F +34 91 319 87 57
 carlos.ac...@aguirrenewman.es
 www.aguirrenewman.com
 Sé ecológico, antes de imprimir este e-mail piense bien si es necesario
 hacerlo



 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org [mailto:
 ovillo-boun...@lists.ovillo.org] En nombre de Rafa Artacho
 Enviado el: jueves, 15 de abril de 2010 17:27
 Para: Ovillo, la lista de CSS en castellano
 Asunto: [Correo sospechoso] Re: [Ovillo] Ajustar lista al ancho del
 contenedor

 He probado así:

 #navbar{color:#FF;width:974px;}
 #navbar ul{width:100%;}
 #navbar ul li{float:left;font-size:1.2em;color:#00FF00;padding:0 5px 0
 10px;border-right:1px solid #000;text-align:right;}

 De este modo el ul queda extendido hasta el 100% del div #navbar, pero los
 li no se ajustan al 100% del ul. Si pongo 100% al li ocupa cada li el 100%
 del div #navbar. ¿Dónde sería el error?

 El style lo puse para ver visualmente hasta dónde se extendía el
 contenedor,
 cuando termine las pruebas lo quitaría.

 Gracias!


 2010/4/15 Luis Mario Álvarez mag...@magrio.net

  Si el contenedor padre tiene definido su ancho, basta con hacer width:
  100%;al tag que necesitas lo llene.
  Te recomendaría además que quites esos estilos de tu ul y los metas en
  algúna hoja css. No es necesario que le asignes clase o id, basta con
  #navbar
  ul {overflow:hidden ;border:1px solid #000;}
 
  Saludos!
 
  2010/4/15 Rafa Artacho teme...@gmail.com
 
   Buenas tardes:
  
   Tengo un menú que será dinámico y que dependiendo de las necesidades
   contendrá un número variable de elementos. Necesitaría que la lista se
   adaptase al ancho del div contenedor (974px). El HTML del menú con 6
   opciones:
  
  div id=navbar
  ul style=overflow:hidden;border:1px solid #000;
  liInicio/li
  liPelículas/li
  liMúsica/li
  liTeatro/li
  liExposiciones/li
  liCoches/li
  /ul
  /div
  
  
   ¿Sería posible hacer esto solamente con CSS o sería necesario usar JS?
   ___
   Lista de distribución Ovillo
   Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
   Puedes modificar tus datos o desuscribirte en la siguiente dirección:
   http://lists.ovillo.org/mailman/listinfo/ovillo
  
 
 
 
  --
  mario álvarez
  desarrollador web
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

 En cumplimiento de la Ley 15/1999, de 13 de diciembre, de Protección de
 Datos de Carácter Personal, le informamos que los datos de carácter personal
 utilizados para la presente comunicación proceden de un fichero de datos de
 carácter personal titularidad de Aguirre Newman, S.A., debidamente
 notificado ante la Agencia Española de Protección de Datos, cuya finalidad
 es la gestión (control, mantenimiento y archivo de la documentación) de la
 relación que mantiene con el GRUPO AGUIRRE NEWMAN y la comunicación con
 terceros. Dichos datos, por consiguiente, han sido incorporados o serán
 incorporados en dicho fichero para los usos y finalidades indicadas,
 pudiendo ser objeto de comunicación a las Compañías que integran el GRUPO
 AGUIRRE NEWMAN, cuya identidad podrá consultar en el aviso legal de la
 página web corporativa www.aguirrenewman.es, cuando sea necesario y/o
 pertinente para el cumplimiento de las finalidades señaladas.
 Si Ud. no consintiese la utilización del correo electrónico para enviarle
 comunicaciones electrónicas,  la comunicación de sus datos de contacto al
 resto de empresas del GRUPO AGUIRRE NEWMAN o deseara revocar su
 consentimiento al tratamiento de sus datos, podrá hacerlo mediante un correo
 electrónico dirigido a asesoriajurid...@aguirrenewman.es. Asimismo, si Ud.
 desea ejercitar sus derechos de acceso

Re: [Ovillo] Ajustar lista al ancho del contenedor

2010-04-15 Por tema Andrés gutiérrez
A mi no se me ocurre una forma de solucionar este problema con ul/li. Se que
puede sonar mal pero los TD de las tablas si que se expanden y reparten
hasta el 100% de su padre. Es una idea.

El 15 de abril de 2010 17:39, Rafa Artacho teme...@gmail.com escribió:

 El problema es el menú será dinámico por lo que en ocasiones pueden
 aparecer
 6 elementos en el menú pero otras veces pueden aparecer 8, 10, 5...

 Con JS se puede lo que quería saber es si se puede hacer únicamente con
 CSS.

 Gracias!


 2010/4/15 Carlos Acero Sánchez carlos.ac...@aguirrenewman.es

 
  Prueba a dividir el número de elementos li entre 100 y se le aplicas:
 
  100/6 = 16.6
 
  #navbar ul li
  {
  float:left;
  font-size:1.2em;
  color:#00FF00;
  padding:0 5px 0 10px;
  border-right:1px solid #000;
  text-align:right;
  width:16.6%
  }
 
 
  Carlos Acero Sánchez
  Dpto. Sistemas
  Aguirre Newman Madrid
 
  C/ General Lacy, 23. 28045 Madrid
  T +31 91 319 13 14 F +34 91 319 87 57
  carlos.ac...@aguirrenewman.es
  www.aguirrenewman.com
  Sé ecológico, antes de imprimir este e-mail piense bien si es necesario
  hacerlo
 
 
 
  -Mensaje original-
  De: ovillo-boun...@lists.ovillo.org [mailto:
  ovillo-boun...@lists.ovillo.org] En nombre de Rafa Artacho
  Enviado el: jueves, 15 de abril de 2010 17:27
  Para: Ovillo, la lista de CSS en castellano
  Asunto: [Correo sospechoso] Re: [Ovillo] Ajustar lista al ancho del
  contenedor
 
  He probado así:
 
  #navbar{color:#FF;width:974px;}
  #navbar ul{width:100%;}
  #navbar ul li{float:left;font-size:1.2em;color:#00FF00;padding:0 5px 0
  10px;border-right:1px solid #000;text-align:right;}
 
  De este modo el ul queda extendido hasta el 100% del div #navbar, pero
 los
  li no se ajustan al 100% del ul. Si pongo 100% al li ocupa cada li el
 100%
  del div #navbar. ¿Dónde sería el error?
 
  El style lo puse para ver visualmente hasta dónde se extendía el
  contenedor,
  cuando termine las pruebas lo quitaría.
 
  Gracias!
 
 
  2010/4/15 Luis Mario Álvarez mag...@magrio.net
 
   Si el contenedor padre tiene definido su ancho, basta con hacer width:
   100%;al tag que necesitas lo llene.
   Te recomendaría además que quites esos estilos de tu ul y los metas en
   algúna hoja css. No es necesario que le asignes clase o id, basta con
   #navbar
   ul {overflow:hidden ;border:1px solid #000;}
  
   Saludos!
  
   2010/4/15 Rafa Artacho teme...@gmail.com
  
Buenas tardes:
   
Tengo un menú que será dinámico y que dependiendo de las necesidades
contendrá un número variable de elementos. Necesitaría que la lista
 se
adaptase al ancho del div contenedor (974px). El HTML del menú con 6
opciones:
   
   div id=navbar
   ul style=overflow:hidden;border:1px solid #000;
   liInicio/li
   liPelículas/li
   liMúsica/li
   liTeatro/li
   liExposiciones/li
   liCoches/li
   /ul
   /div
   
   
¿Sería posible hacer esto solamente con CSS o sería necesario usar
 JS?
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
   
  
  
  
   --
   mario álvarez
   desarrollador web
   ___
   Lista de distribución Ovillo
   Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
   Puedes modificar tus datos o desuscribirte en la siguiente dirección:
   http://lists.ovillo.org/mailman/listinfo/ovillo
  
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
  En cumplimiento de la Ley 15/1999, de 13 de diciembre, de Protección de
  Datos de Carácter Personal, le informamos que los datos de carácter
 personal
  utilizados para la presente comunicación proceden de un fichero de datos
 de
  carácter personal titularidad de Aguirre Newman, S.A., debidamente
  notificado ante la Agencia Española de Protección de Datos, cuya
 finalidad
  es la gestión (control, mantenimiento y archivo de la documentación) de
 la
  relación que mantiene con el GRUPO AGUIRRE NEWMAN y la comunicación con
  terceros. Dichos datos, por consiguiente, han sido incorporados o serán
  incorporados en dicho fichero para los usos y finalidades indicadas,
  pudiendo ser objeto de comunicación a las Compañías que integran el GRUPO
  AGUIRRE NEWMAN, cuya identidad podrá consultar en el aviso legal de la
  página web corporativa www.aguirrenewman.es, cuando sea necesario y/o
  pertinente para el cumplimiento de las finalidades señaladas.
  Si Ud