[Ovillo] Centrar verticalmente input type radio
Hola! Estoy maquetando un formulario que, entre otras cosas contiene una lista horizontal de radiobuttons. El contenido de éstos no siempre tiene la misma altura (son imágenes, con distintos heights). Lo he intentado de mil maneras, pero no lo consigo. El HTML vendría a ser éste: fieldset legend.../legend ul lilabel for=...input type=radio id=... name... /img src=... alt=... //label/li lilabel for=...input type=radio id=... name... /img src=... alt=... //label/li [...] /ul /fieldset Así que se todo reduce a centrar verticalmente el input y el img dentro del label. Debería ser posible, no? Gracias y un saludo! Gael ___ 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] Centrar verticalmente input type radio
Hola, Gael
Estoy maquetando un formulario que, entre otras cosas contiene una lista
horizontal de radiobuttons. El contenido de éstos no siempre tiene la
misma altura (son imágenes, con distintos heights).
¿No te funciona esto?
li {display: inline;}
label * {
vertical-align: middle;
}
___
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] Centrar verticalmente input type radio
Se me ocurre una cosa asi rápida, dale esto a la imagen:
img{
vertical-aling:middle;
} ; a mi me funciona
Saludos
para ajustarlo mejor juega con los padding del input.
El 27/08/07, Gael [EMAIL PROTECTED] escribió:
Hola!
Estoy maquetando un formulario que, entre otras cosas contiene una lista
horizontal de radiobuttons. El contenido de éstos no siempre tiene la
misma altura (son imágenes, con distintos heights). Lo he intentado de
mil maneras, pero no lo consigo.
El HTML vendría a ser éste:
fieldset
legend.../legend
ul
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
[...]
/ul
/fieldset
Así que se todo reduce a centrar verticalmente el input y el img dentro
del label. Debería ser posible, no?
Gracias y un saludo!
Gael
___
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
Re: [Ovillo] Restricciones en internet USA ??
Yo vivo en canarias y ese enlace de natur-atlas.com lleva como tres minutos esperandolo... no se si vendra o no la página.. lleva ya 5 minutos y no llega el site, pero el ping si da... El día 23/08/07, xNoleet [EMAIL PROTECTED] escribió: Desde Colombia, accede normalmente :). El día 23/08/07, Borja Martín [EMAIL PROTECTED] escribió: Yo acabo de probar a visitar la página usando un proxy que está en estados unidos y no hay problema. En caso de existir algún tipo de restricción igual se encuentra a nivel de ISP. Coméntale que prueba a entrar utilizando un servidor proxy y si así puede entrar, o bien se trata de un problema con las DNS o efectivamente le están bloqueando el acceso. Saludos. On 8/23/07, JORRETO LLOVES, CARLOS [EMAIL PROTECTED] wrote: Hola amigos. Me gustaría si hay alguien que pueda visitar esta página desde EE.UU. http://www.martinagardens.com/Links.htm http://www.martinagardens.com/Links.htm y pinchar en el link último ( natur-atlas.com) porque me dice la dueña de la página que el link no funciona desde América . Desde España funciona bien y me consta que desde Africa también. La página está alojada en un server Español, aunque el contenido es sobre Marruecos. Sabéis si hay en USA algún tipo de restricciones sobre todo lo que sea árabe? me podéis confirmar alguno si funciona desde Estados Unidos? Gracias. ___ 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 -- /** * dagi3d v4 | http://dagi3d.net */ ___ 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 -- xNoleet ][ freelance graphic designer artist ] http://www.dojohabit.com ][ Dôjo ] http://www.luser-co.com ][ Lüser - Tees de diseño x Fuck Fashion! ] http://vm.dojohabit.com ][ personal portfolio ] http://h3x.dojohabit.com ][ experimental project ] ___ 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 -- -- :: studio.macaronesico.com :: -- -- web and printed advertising -- freelance designer - translator ___ 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
[Ovillo] OT - Planificando proyectos web
Hola, ando tras algún software que me aporte practicidad y me ayude a optimizar mi sistema de planificación y producción de proyectos web. Que sea libre y se pueda instalar en la web para que mis clientes hagan el seguimiento de los procesos. Alguien de aquí se apoya en herramientas de este tipo? Puede aconsejarme desde su experiencia? Saludos y se agradece cualquier orientación, Nadia _ Desarrollos Visuales www.tintedigital.com ___ 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] OT - Planificando proyectos web
yo he utilizado alguna vez active collab, está orientado al trabajo en equipo de proyectos, permitiendo la supervisión por parte del cliente etc.. y muchas otras funciones como la creación de hitos y demás. te pongo el enlace http://www.activecollab.com/ --- AraDaen, diseño y programación web con estándares www.aradaen.com ___ 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] Centrar verticalmente input type radio
Gracias a ambos por vuestras respuestas.
Funcionan, pero no me sirven , porque olvidé deciros que tengo que
darles un ancho y un alto a todos los li para que queden cuadriculados.
Es decir, tengo una cuadrícula con n input type=radio, que se van
colocando, haya los que haya, de izquierda a derecha y de arriba a abajo
en una lista horizontal en que caben cuatro inputs por fila (quedan
dispuestos como si fuera una tabla, pero no son datos tabulares, son una
lista de opciones para escoger una). Por eso quiero que me queden
centrados verticalmente el input y el img dentro del label.
Gracias de nuevo
Un saludo
Gael
jaume op escribió:
Se me ocurre una cosa asi rápida, dale esto a la imagen:
img{
vertical-aling:middle;
} ; a mi me funciona
Saludos
para ajustarlo mejor juega con los padding del input.
El 27/08/07, Gael [EMAIL PROTECTED] escribió:
Hola!
Estoy maquetando un formulario que, entre otras cosas contiene una lista
horizontal de radiobuttons. El contenido de éstos no siempre tiene la
misma altura (son imágenes, con distintos heights). Lo he intentado de
mil maneras, pero no lo consigo.
El HTML vendría a ser éste:
fieldset
legend.../legend
ul
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
[...]
/ul
/fieldset
Así que se todo reduce a centrar verticalmente el input y el img dentro
del label. Debería ser posible, no?
Gracias y un saludo!
Gael
___
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] OT - Planificando proyectos web
Hola Nadia! Por tu descripción creo que andas buscando una herramienta tipo: http://www.activecollab.com/ Espero que sea de utilidad. Saludos, Aleyda El día 27/08/07, Nadia Fankhauser [EMAIL PROTECTED] escribió: Hola, ando tras algún software que me aporte practicidad y me ayude a optimizar mi sistema de planificación y producción de proyectos web. Que sea libre y se pueda instalar en la web para que mis clientes hagan el seguimiento de los procesos. Alguien de aquí se apoya en herramientas de este tipo? Puede aconsejarme desde su experiencia? Saludos y se agradece cualquier orientación, Nadia _ Desarrollos Visuales www.tintedigital.com ___ 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
Re: [Ovillo] OT - Planificando proyectos web
o quizas trac ___ 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] Centrar verticalmente input type radio
Deberias dar medidas pero mira asi:
style
* {margin:0; padding:0;}
ul{ /*creo la tabla*/
display:block;
width:600px;
list-style:none;
}
li{/*medidas para las celdas*/
width:150px;
height:50px;
display:blok;
float:left;
line-height:100%;
}
img{
vertical-align:middle;
}
/style
/***/
ul
lilabel for=...input type=radio id=input name... /
bonito bonitoimg
src=Mis imágenes/mail.jpgalt=... //label
/li
/ul
ul
lilabel for=...input type=radio id=input name... /
bonito bonitoimg
src=Mis imágenes/mail.jpgalt=... //label
/li
/ul
Pon tantas Ul como filas y los LI como columnas (por ejemplo 4ul y 5
li), para hacer una tabla de 4 columnas y cinco filas.
El 27/08/07, Gael [EMAIL PROTECTED] escribió:
Gracias a ambos por vuestras respuestas.
Funcionan, pero no me sirven , porque olvidé deciros que tengo que
darles un ancho y un alto a todos los li para que queden cuadriculados.
Es decir, tengo una cuadrícula con n input type=radio, que se van
colocando, haya los que haya, de izquierda a derecha y de arriba a abajo
en una lista horizontal en que caben cuatro inputs por fila (quedan
dispuestos como si fuera una tabla, pero no son datos tabulares, son una
lista de opciones para escoger una). Por eso quiero que me queden
centrados verticalmente el input y el img dentro del label.
Gracias de nuevo
Un saludo
Gael
jaume op escribió:
Se me ocurre una cosa asi rápida, dale esto a la imagen:
img{
vertical-aling:middle;
} ; a mi me funciona
Saludos
para ajustarlo mejor juega con los padding del input.
El 27/08/07, Gael [EMAIL PROTECTED] escribió:
Hola!
Estoy maquetando un formulario que, entre otras cosas contiene una lista
horizontal de radiobuttons. El contenido de éstos no siempre tiene la
misma altura (son imágenes, con distintos heights). Lo he intentado de
mil maneras, pero no lo consigo.
El HTML vendría a ser éste:
fieldset
legend.../legend
ul
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
[...]
/ul
/fieldset
Así que se todo reduce a centrar verticalmente el input y el img dentro
del label. Debería ser posible, no?
Gracias y un saludo!
Gael
___
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
Re: [Ovillo] OT - Planificando proyectos web
Gracias AraDaen y Aleyda... ya me puse a leer sobre activeCollab. saludos! _ Desarrollos Visuales www.tintedigital.com ___ 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] OT - Planificando proyectos web
si generas código GPL, no te sirve sourceforge.net? On 8/27/07, Nadia Fankhauser [EMAIL PROTECTED] wrote: Gracias AraDaen y Aleyda... ya me puse a leer sobre activeCollab. saludos! _ Desarrollos Visuales www.tintedigital.com ___ 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 -- xadap www.tac822.net || www.MusicaLliure.net || www.MusicaDeLaTerra.net ___ 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] OT - Planificando proyectos web
Yo tambien uso ActiveCollab.. muy bueno.. :) On 8/27/07, Edu G. - xadap [EMAIL PROTECTED] wrote: si generas código GPL, no te sirve sourceforge.net? On 8/27/07, Nadia Fankhauser [EMAIL PROTECTED] wrote: Gracias AraDaen y Aleyda... ya me puse a leer sobre activeCollab. saludos! _ Desarrollos Visuales www.tintedigital.com ___ 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 -- xadap www.tac822.net || www.MusicaLliure.net || www.MusicaDeLaTerra.net ___ 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
Re: [Ovillo] Centrar verticalmente input type radio
Gracias por tu ayuda, Jaume!
He trabajado un poco a partir de tu código. Va bastante bien y, de
hecho, puedo una única lista para toda la tabla, así que no haría
falta una lista para cada fila, ya que los li tienen el float: left.
Con tu código consigo centrar verticalmente el contenido de cada li
por separado: el input type=radio y su img correspondiente (ambos
dentro de un label) aparecen centrados verticalmente.
De todas formas, no se centra verticalmente el conjunto de la lista.
Supongo que habría que hacerlo elemento a elemento, según el tamaño que
vaya a tener cada uno.
Como me explico bastante mal, pongo el ejemplo (los tamaños son lo de
menos y los bordes son para verlo más claro). Sólo hace falta una imagen
que se llame r.gif para el ejemplo:
CSS:
* {margin:0; padding:0;}
ul{
list-style: none;
width: 220px;
}
li{
width: 70px;
height: 50px;
display: block;
float: left;
border: 1px solid green;
}
label{
position: relative;
top: 25px; /* esto tendría que ser diferente para cada */
margin-top: -25px; /* label, según el height de la imagen contenida */
display:block;
border: 1px solid blue;
}
label * {
vertical-align: middle;
border: 1px solid red;
}
HTML:
form
fieldset
legendLorem ipsum/legend
ul
lilabel for=a1input type=radio id=a1 /img src=r.gif
width=15 height=15 alt=... //label/li
lilabel for=a2input type=radio id=a2 /img src=r.gif
width=15 height=15 alt=... //label/li
lilabel for=a3input type=radio id=a3 /img src=r.gif
width=15 height=25 alt=... //label/li
lilabel for=a4input type=radio id=a4 /img src=r.gif
width=15 height=20 alt=... //label/li
lilabel for=a5input type=radio id=a5 /img src=r.gif
width=35 height=15 alt=... //label/li
lilabel for=a6input type=radio id=a6 /img src=r.gif
width=15 height=15 alt=... //label/li
lilabel for=a7input type=radio id=a7 /img src=r.gif
width=20 height=20 alt=... //label/li
lilabel for=a8input type=radio id=a8 /img src=r.gif
width=15 height=15 alt=... //label/li
/ul
/fieldset
/form
Visto lo visto, si nadie sabe de una solución mágica (o de una forma
diferente de marcar el conjunto de radiobuttons horizontal), me veré
obligado a maquetarlo con tablas ;-)
Un saludo!
Gael
jaume op escribió:
Deberias dar medidas pero mira asi:
style
* {margin:0; padding:0;}
ul{ /*creo la tabla*/
display:block;
width:600px;
list-style:none;
}
li{/*medidas para las celdas*/
width:150px;
height:50px;
display:blok;
float:left;
line-height:100%;
}
img{
vertical-align:middle;
}
/style
/***/
ul
lilabel for=...input type=radio id=input name... /
bonito bonitoimg
src=Mis imágenes/mail.jpgalt=... //label
/li
/ul
ul
lilabel for=...input type=radio id=input name... /
bonito bonitoimg
src=Mis imágenes/mail.jpgalt=... //label
/li
/ul
Pon tantas Ul como filas y los LI como columnas (por ejemplo 4ul y 5
li), para hacer una tabla de 4 columnas y cinco filas.
El 27/08/07, Gael [EMAIL PROTECTED] escribió:
Gracias a ambos por vuestras respuestas.
Funcionan, pero no me sirven , porque olvidé deciros que tengo que
darles un ancho y un alto a todos los li para que queden cuadriculados.
Es decir, tengo una cuadrícula con n input type=radio, que se van
colocando, haya los que haya, de izquierda a derecha y de arriba a abajo
en una lista horizontal en que caben cuatro inputs por fila (quedan
dispuestos como si fuera una tabla, pero no son datos tabulares, son una
lista de opciones para escoger una). Por eso quiero que me queden
centrados verticalmente el input y el img dentro del label.
Gracias de nuevo
Un saludo
Gael
jaume op escribió:
Se me ocurre una cosa asi rápida, dale esto a la imagen:
img{
vertical-aling:middle;
} ; a mi me funciona
Saludos
para ajustarlo mejor juega con los padding del input.
El 27/08/07, Gael [EMAIL PROTECTED] escribió:
Hola!
Estoy maquetando un formulario que, entre otras cosas contiene una lista
horizontal de radiobuttons. El contenido de éstos no siempre tiene la
misma altura (son imágenes, con distintos heights). Lo he intentado de
mil maneras, pero no lo consigo.
El HTML vendría a ser éste:
fieldset
legend.../legend
ul
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
lilabel for=...input type=radio id=... name... /img
src=... alt=... //label/li
[...]
/ul
/fieldset
Así que se todo reduce a centrar verticalmente el input y el img dentro
del label. Debería ser posible, no?
Gracias y un saludo!
Gael
___
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:
Re: [Ovillo] Valor sem á ntico de la etiqueta div
Juan Jorge Muñoz Herrero escribió: Efectivamente, es para division de contenido, otra cosa es como se use... Estoy harto de ver cosas como div class=menu ul li.../li /ul /div Pero bueno, poco a poco la gente irá tomando las buenas costumbres, aunque todavía hay quien maquete con tablas... Bueno yo estoy chapado a la antigua es mas hace poco que maqueto con css y pues debo aceptar que suelo hacer eso que mencionas arriba y pues bien con el fin de mejorar pues me gustaría pedirles algún documento o manual tutorial etc donde pueda aprender sobre las buenas costumbres la verdad es que he estado buscando sobre usabilidad, accesibilidad etc etc y pues me gustaria aprender mas sobre las buenas costumbres cualquier apunte que tengan pagina informativa(de preferencia en español mi ingles sux xD pero si no hay de otra pos ni modo xD) etc etc sera bien recibida ^^ gracias Saludos ___ 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
[Ovillo] [OT] Oferta de Indra Sevilla
Buenas, en Indra Sevilla estamos buscando candidatos para ampliar nuestro grupo de interfaz, y quería aprovechar el nivel de la lista de distribución para publicar la oferta. El perfil buscado es bastante amplio, y buscamos personas con experiencia en el sector. Si alguien está interesado me puede enviar su curriculum al email: [EMAIL PROTECTED] La oferta publicada es la siguiente: ** Diseñador de Interacción Requisitos: - Conocimientos de HCI y principios de diseño de interfaz. - Capacidad de modelar esquemas y prototipos high-fidelity, bajo softwara gráfico (principalmente Freehand, Illustrator, Photoshop) - Experiencia detectando y resolviendo problemas de usabilidad - Conocimiento técnico de las capacidades de las tecnologías web (XHTML, CSS, JavaScript, Ajax, ) - Habilidades de presentación y redacción Descripción del puesto: - Participar en el diseño de proyectos centrado en el usuario - Generar requerimientos funcionales a partir de investigaciones de usuario cualitativas - Definir escenarios de uso y personajes - Plasmar el diseño de interacción - Asesorar a diseñadores gráficos y desarrolladores en temas de interacción - Evaluar y confirmar el diseño gráfico, el desarrollo y la implementación - Ejecutar y Diseñar tests de usabilidad PD: Se valora aportar portfolio Saludos. ___ 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
