Foros del Web » Creando para Internet » CSS »

Como alinear verticalmente 'inferior' imagenes con su pie de foto?

Estas en el tema de Como alinear verticalmente 'inferior' imagenes con su pie de foto? en el foro de CSS en Foros del Web. Tengo una galeria de fotos que se genera dinàmincamente mediante un lenguaje script de servidor (php). El problema que tengo es que si hay imagenes ...
  #1 (permalink)  
Antiguo 05/01/2004, 10:05
 
Fecha de Ingreso: enero-2004
Mensajes: 235
Antigüedad: 13 años, 11 meses
Puntos: 0
Como alinear verticalmente 'inferior' imagenes con su pie de foto?

Tengo una galeria de fotos que se genera dinàmincamente mediante un lenguaje script de servidor (php).

El problema que tengo es que si hay imagenes siempre me quedan alineadas arriba , y en consecuencia si una imagen tiene una altura menor a las demás no quedan bien alineadas en el bottom.

Otra cuestión es no puedo limitar el <a> con una heigh estatica ya que el usuario puede modificar el tamaño de los thumbnails mediante un formulario, y por tanto el height o el widht no puedo dejarlos estaticos.

Resumen: Como alinear verticalmente 'inferior' imagenes con su pie de foto?

Os dejo el código html resultante del link:
Cita:
<a class='thumb' href='uploaded_images/image3.jpg' target='new'> <img src='/welog/imagelist.php?src=uploaded_images/image3.jpg&amp;width=198&amp;height=200' width=198 height=200 name='image3.jpg' /><br />image3.jpg<br />408x412 | 23/12/2003 | 26Kb</a></p>
Aqui el css que uso:
Cita:
.thumb { float: left; border: 1px solid #999; margin: 0 15px 15px 0;
padding: 5px; text-align: center; vertical-align: bottom;}
img { border: none; vertical-align: bottom;}
a { text-decoration: none; color: #000; white-space: nowrap;}
a:hover {text-decoration:underline;}
I os envio una foto de lo que me pasa:


I aqui la foto limitando en este caso height=300px en .thumb y que tampoco funciona:
  #2 (permalink)  
Antiguo 06/01/2004, 06:41
 
Fecha de Ingreso: enero-2004
Mensajes: 235
Antigüedad: 13 años, 11 meses
Puntos: 0
Pregunta Vertical align

Voy a dejar un link con el código y las imagenes parar que podais hacer-lo funcionar en casa.

Antes el problema es que el tamanyo de las capas era diferente en función del tamanyo de la imagen.

Ahora sólo resta alinear verticalmente las imagenes en la parte inferior para que quede mejor presentado.

El fichero sólo ocupa 10kb y incluye:
-Código html y css. (no superan las 100 linias).
-2 imagenes.

FICHERO!
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 15:14.