Hola!
Como siempre, recurro a la lista después de estarme rompiendo la cabeza
durante horas con una maldita lista. :-)
Lo que quiero conseguir es una lista horizontal centrada, la típica con:
ul { text-align: center; margin: 0 auto; }
li { display: inline; }
Pero el contenido de los elementos son imágenes con un pie de foto. Algo
así:
<ul>
<li><img src="foto1.jpg" width="150" height="100" alt="Foto 1" />Pie
de foto 1</li>
<li><img src="foto2.jpg" width="150" height="100" alt="Foto 2" />Pie
de foto 2</li>
<li><img src="foto3.jpg" width="150" height="100" alt="Foto 3" />Pie
de foto 3</li>
</ul>
De manera que, para que quede el pie bajo la foto, debería poner
img { display: block; }
con lo que el display inline de los li se va a hacer puñetas y la lista
queda vertical.
He probado con float: left en los li (pero no quedan centrados
horizontalmente), con <p> en los pies de foto (pero vuelve a quedar
vertical), con <br /> entre la foto y el pie... Probaría con listas de
definición (dt para la foto y dd para el pie) pero no todas las fotos
tendrán pie y no me convence la idea de dejar dd vacíos.
Alguien sabe cómo conseguirlo? Cómo centrar horizontalmente una lista
con elementos de bloque o cómo conseguir el mismo efecto con otro marcado?
Muchas gracias!
Gael
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo