Problema con tablas

delta132 · #1 (**permalink**) 31/08/2006, 21:27

Hola a todos, estoy intentandor aprender a manejar las tablas, pero tengo un problema con esta pagina:

http://www.freewebs.com/andreti68/

como veran no encajan todas las imagenes, aca dejo el codigo:

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento sin t&iacute;tulo</title>
</head>

<body bgcolor="#CCCCCC" topmargin="0" bottommargin="0" marginheight="0" marginwidth="0">

<table border="0" cellspacing="0" cellpadding="0" width="768" height="496">

	<tr>
	
		<td rowspan="3">
		<img src="Images/index_01.gif" width="190" height="188" alt="" /></td>
		<td>
		<img src="Images/index_02.png" width="577" height="48" alt="" /></td>
		<td>
		<img src="Images/espacio.gif" width="1" height="48" /></td>
	</tr>	
		
	
	<tr>
		<td>
		<img src="Images/index_03.gif" width="577" height="71" alt="" /></td>
				<td>
		<img src="Images/espacio.gif" width="1" height="71" /></td>
	</tr>	
		
	<tr>	
		<td rowspan="2">
		<img src="Images/index_04.gif" width="577" height="165" alt="" /></td>
				<td>
		<img src="Images/espacio.gif" width="1" height="165" /></td>
				
	</tr>
	
	<tr>
		<td rowspan="2"><img src="Images/index_05.gif" width="190" height="308" alt="" /></td>
		<td><img src="Images/espacio.gif" width="1" height="308" /></td>
	</tr>	
		
	<tr>	
		<td>
		<img src="Images/index_06.gif" width="577" height="212" alt="" /></td>
		<td>
		<img src="Images/espacio.gif" width="1" height="212" /></td>
	</tr>
</table>	

</body>
</html>

Ojala alguien me pudiera explicar porque no encajan, si las medidas estan bien, gracias de ante mano. Saludos¡¡

Lucha · #2 (**permalink**) 01/09/2006, 07:16

Hola.

Prueba a modificar la propiedad "rowspan". Esta propiedad le dice a la celda cuantas filas tiene que igualar en altura. Si el rowspan es 2, significa que la altura de esa celda será suficiente para abarcar dos de las celdas de la derecha o de la izquierda.

Me explico faltal, así que te dejo con un ejemplo:

<TABLE WIDTH=100% BORDER=1 CELLPADDING=4 CELLSPACING=3 STYLE="page-break-before: always">
<COL WIDTH=128*>
<COL WIDTH=128*>
<TR VALIGN=TOP>
<TD ROWSPAN=2 WIDTH=50%>
<P><BR>
</P>
</TD>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
</TR>
<TR>
<TD WIDTH=50% VALIGN=TOP>
<P><BR>
</P>
</TD>
</TR>
</TABLE>

Este código nos muestra 3 celdas que encajan perfectamente por que la celda grande tiene "rowspan=2", para que encajen las otras dos.

<TABLE WIDTH=100% BORDER=1 CELLPADDING=4 CELLSPACING=3 STYLE="page-break-before: always">
<COL WIDTH=128*>
<COL WIDTH=128*>
<TR VALIGN=TOP>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
</TR>
<TR VALIGN=TOP>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
<TD></TD>
</TR>
</TABLE>

Y aqui vemos un desastre de tabla, solo quitandole a la celda grande el rowspan.

delta132 · #3 (**permalink**) 01/09/2006, 11:47

Muchas gracias por responder, pero si modifico las filas y el rowspan se desorganiza todo, segun estuve viendo, el problema creo que es del tamaño que aplico en la imagen espacio.gif, pero no estoy seguro, ojala alguien me pueda decir otra forma de soolucionar el problema.

edohen · #4 (**permalink**) 01/09/2006, 19:15

bueno si estas utilizando dreamweaver como editor.... pues selecciona cada imagen y dale reset Size en la ventana propiedades y talvez pueda solucionar tu problema... yo siempre utilizo esa opcion para arreglar ese tipo de problemas.

Saludos

delta132 · #5 (**permalink**) 01/09/2006, 19:21

intente tambien eso pero nada :S, sigue =, realmente me doy cuenta que el problema es del valor que le estoy dando a height sobre la imagen espacio.gif, pero no se como calcular el valor exacto para que encajen todas las imagenes, gracias de todos modos.

edohen · #6 (**permalink**) 01/09/2006, 19:37

ahora que lo mencionas acabo de acordame que hay un jscript que hace que las imagenes sean escalables automaticamente... porque no buscas algun codigo js que te pueda ayudar.... si encuentro algo te lo envio....
saludos

Sals · #7 (**permalink**) 03/09/2006, 03:15

El mismo codigo:

Cita:

<TABLE WIDTH=100% BORDER=1 CELLPADDING=4 CELLSPACING=3 STYLE="page-break-before: always">
<COL WIDTH=128*>
<COL WIDTH=128*>
<TR VALIGN=TOP>
<TD ROWSPAN=2 WIDTH=50%>
<P><BR>
</P>
</TD>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
</TR>
<TR>
<TD WIDTH=50% VALIGN=TOP>
<P><BR>
</P>
</TD>
</TR>
</TABLE>

Este código nos muestra 3 celdas que encajan perfectamente por que la celda grande tiene "rowspan=2", para que encajen las otras dos.

<TABLE WIDTH=100% BORDER=1 CELLPADDING=4 CELLSPACING=3 STYLE="page-break-before: always">
<COL WIDTH=128*>
<COL WIDTH=128*>
<TR VALIGN=TOP>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
</TR>
<TR VALIGN=TOP>
<TD WIDTH=50%>
<P><BR>
</P>
</TD>
<TD></TD>
</TR>
</TABLE>