[Ovillo] Preview de galerias usando listas DL
buenas, estoy intentando hacer una sección de preview para fotos usando
listas DL, en Firefox y Opera se muestra bien pero estoy teniendo problemas
para que funcione en internet explorer. aqui les pongo el codigo html y css,
talve exista algun hack para ie u otra forma de como maquetar esto sin usar
tablas y que funcione para los principales navegadores.
un saludo a la lista.
HTML
div id=galerias
br /
div id=arriba
dl
dtimg src=imagenes/galerias/gal01.jpg alt=fotos //dt
ddema href=galerias/index.php?galerias=1Galeria 1/a/em/dd
/dl
dl
dtimg src=imagenes/galerias/gal02.jpg alt=fotos //dt
ddema href=galerias/index.php?galerias=2Galeria 2/a/em/dd
/dl
dl
dtimg src=imagenes/galerias/gal03.jpg alt=fotos //dt
ddema href=galerias/index.php?galerias=3Galeria 3/a/em/dd
/dl
/div
div id=abajo
dl
dtimg src=imagenes/galerias/gal04.jpg alt=fotos //dt
ddema href=galerias/index.php?galerias=4Galeria 4/a/em/dd
/dl
dl
dtimg src=imagenes/galerias/gal05.jpg alt=fotos //dt
ddema href=galerias/index.php?galerias=5Galeria 5/a/em/dd
/dl
dl
dtimg src=imagenes/galerias/gal06.jpg alt=fotos //dt
ddema href=galerias/index.php?galerias=6Galeria 6/a/em/dd
/dl
/div
p class=limpianbsp;/p
br /
/div
CSS
-
#galerias {
margin-left: 1em;
margin-right: 1em;
padding: 0.2em;
border: 0;
}
div#arriba {
float: left;
}
div#abajo dl, div#arriba dl {
display: inline;
float: left;
}
#galerias dt img {
width: 160px;
height: 120px;
border: 0.2em #000 solid;
padding: 0;
margin: 0;
}
div#arriba dt, div#abajo dt {
display: block;
float: left;
width: 11em;
text-align: center;
vertical-align: middle;
}
div#arriba dd, div#abajo dd {
color: #000;
background-color: #fff;
font-weight: bold;
border-top: 0.2em #000 solid;
display: block;
width: 11em;
text-align: center;
vertical-align: middle
}
div#arriba dd:hover, div#abajo dd:hover {
color: #000;
background-color: #c93;
border-bottom: 0.2em #000 solid;
border-top: 1px #000 solid;
}
p.limpia {
clear:both;
}
--
Jonathan C.
[EMAIL PROTECTED]
___
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] Preview de galerias usando listas DL
On 11/30/06, Jonathan C. [EMAIL PROTECTED] wrote: estoy teniendo problemas para que funcione en internet explorer. IE solo reconoce :hover para los elementos a. por lo que dd:hover es igual a nada. podes intentar solucionarlo usando un behavior de IE. aca explican cómo: http://www.xs4all.nl/~peterned/csshover.html mas alla de eso revise el código que mandaste metiendolo en un html con doctype XHTML 1.0 Strict y no se ve de la misma manera en Firefox 1.5 y en Opera 9 (ni en IE7). también hay algun tipo de problema con el hover porque al pasar sobre un item de los que quedan sobre la fila superior los que quedan en la linea inferior saltan de lugar. no se bien qué es lo que estas intentando generar pero esta es una buena técnica para galerias de fotos: http://www.huddletogether.com/projects/lightbox2/ saludos. -- inti castro [EMAIL PROTECTED] ___ 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] Preview de galerias usando listas DL
hola inti, gracias por responder... 2006/11/30, inti castro [EMAIL PROTECTED]: On 11/30/06, Jonathan C. [EMAIL PROTECTED] wrote: estoy teniendo problemas para que funcione en internet explorer. IE solo reconoce :hover para los elementos a. por lo que dd:hover es igual a nada. pues eso del hover en IE ya lo conocia, el problema es que las listas no quedan bien posicionadas como se muestran en Firefox u Opera. podes intentar solucionarlo usando un behavior de IE. aca explican cómo: http://www.xs4all.nl/~peterned/csshover.htmlhttp://www.xs4all.nl/%7Epeterned/csshover.html mas alla de eso revise el código que mandaste metiendolo en un html con doctype XHTML 1.0 Strict y no se ve de la misma manera en Firefox 1.5 y en Opera 9 (ni en IE7). también hay algun tipo de problema con el hover porque al pasar sobre un item de los que quedan sobre la fila superior los que quedan en la linea inferior saltan de lugar. ese problema que se te presento se debe a otros factores, debido a que esas listas estan dentro de otra capa que las contiene y que forman parte de una pagina mas elaborada. tratare de poner el diseño completo en la web y pasarles el link, ya que ahora mismo lo estoy probando en mi maquina de manera local. no se bien qué es lo que estas intentando generar pero esta es una buena técnica para galerias de fotos: http://www.huddletogether.com/projects/lightbox2/ saludos. -- inti castro [EMAIL PROTECTED] ___ 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 -- Jonathan C. [EMAIL PROTECTED] ___ 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] Preview de galerias usando listas DL
hola de nuevo a la lista, aqui esta el enlace donde se puede ver como queda el diseño de las listas... inti aqui veras el problema que plantee en el primer mensaje. http://wapservices.host.sk/galerias.php un saludo y disculpa a la lista por tanto postear. 2006/11/30, Jonathan C. [EMAIL PROTECTED]: hola inti, gracias por responder... 2006/11/30, inti castro [EMAIL PROTECTED] : On 11/30/06, Jonathan C. [EMAIL PROTECTED] wrote: estoy teniendo problemas para que funcione en internet explorer. IE solo reconoce :hover para los elementos a. por lo que dd:hover es igual a nada. pues eso del hover en IE ya lo conocia, el problema es que las listas no quedan bien posicionadas como se muestran en Firefox u Opera. podes intentar solucionarlo usando un behavior de IE. aca explican cómo: http://www.xs4all.nl/~peterned/csshover.html http://www.xs4all.nl/%7Epeterned/csshover.html mas alla de eso revise el código que mandaste metiendolo en un html con doctype XHTML 1.0 Strict y no se ve de la misma manera en Firefox 1.5 y en Opera 9 (ni en IE7). también hay algun tipo de problema con el hover porque al pasar sobre un item de los que quedan sobre la fila superior los que quedan en la linea inferior saltan de lugar. ese problema que se te presento se debe a otros factores, debido a que esas listas estan dentro de otra capa que las contiene y que forman parte de una pagina mas elaborada. tratare de poner el diseño completo en la web y pasarles el link, ya que ahora mismo lo estoy probando en mi maquina de manera local. no se bien qué es lo que estas intentando generar pero esta es una buena técnica para galerias de fotos: http://www.huddletogether.com/projects/lightbox2/ saludos. -- inti castro [EMAIL PROTECTED] ___ 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 -- Jonathan C. [EMAIL PROTECTED] -- Jonathan C. [EMAIL PROTECTED] ___ 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
