Imágenes

Silvia
25 de Agosto del 2004
Hola al grupo,

tengo la siguiente tabla con las siguientes imágenes:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td width="50%"><img src="foto.jpg" width="100%"></td>
<td width="50%">&nbsp;</td></tr>
<tr><td width="50%">&nbsp;</td>
<td width="50%"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td width="50%"><img src="foto.jpg" width="100%"></td>
<td width="50%"><img src="foto.jpg" width="100%"></td></tr>
</table></td>
</tr>
</table>

en teoría esto tendría que ser una tabla con dos filas al 50% de la ventana del navegador, donde en la fila 1 - columna 1, hay una imágen al 100% de la celda.
Y en la fila 2 - columna 2, hay otra tabla con dos filas al 50% cada una, y con dos imágenes al 100% de las celdas respectivamente. O sea estas dos últimas imágenes tendrían que ser la mitad de la primera.
Cuando lo visualizo en la pestaña "Diseño" del dreamweaver se cumple la teoría: Todo funciona correctamente. Cuando lo miro en el navegador, las dimensiones de las tablas se modifican y no sale el resultado esperado.

No sé si me he explicado muy bien...
Agradecería una respuesta. Estoy desesperada...
Muchas gracias
Silvia

Mikel
25 de Agosto del 2004
El problema es que al ponerle width="100%" en la imagen no le estas indicando que su tamaño es el 100% de la celda sino el 100% del tamaño real de la imagen (foto.jpg).

Yo esto lo he solucionado alguna vez calculando el width de la imagen respecto al tamaño del ancho de la pantalla. Te pongo el codigo de como lo haría yo.

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%"><img src="foto.jpg" name="Imagen1"></td>
<td width="50%">&nbsp;</td>
</tr>
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%"><img src="foto.jpg" name="Imagen2"></td>
<td width="50%"><img src="foto.jpg" name="Imagen3"></td>
</tr>
<script language=javascript>
document.all.Imagen1.width=screen.width / 2.1
document.all.Imagen2.width=screen.width / 4.2
document.all.Imagen3.width=screen.width / 4.2
</script>
</table>
</td>
</tr>
</table>

Para hacer exactamente lo que tu querias para Imagen1 deberia haber dividido el ancho de la pantalla entre 2 y para Imagen2 e Imagen3 dividirlo entre 4. Lo he incrementado un poco (2.1 y 4.2) por que sino seguro que te aparecen los scroll y no entrara todo en la pantalla.

Espero haberme explicado. Si tienes alguna duda mandame un mensaje a mi cuenta de correo.

Saludos desde Euskal Herria.

Mikel