Ver Mensaje Individual
  #7 (permalink)  
Antiguo 19/05/2007, 18:11
Avatar de programeitor
programeitor
 
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 19 años, 2 meses
Puntos: 9
Re: Estructura de tabla atípica (reto)

hola

esto es lo maximo que he logrado componer, el texto grande se cuela por debajo de la foto, y ademas he tenido que echar mano de dos divs. espero que te valga.

Código HTML:
<html><head>
<title>tabla maquetada</title><style>
body{background:gray;margin:5%;}
table{color:black;border-collapse:collapse;}
tr{border:1px solid black;}
td{position:relative;vertical-align:top;}
.texto{
top:0px;left:0px;width:500px;height:300px;z-index:0;
border:1px solid black;padding:10px;background:white;
}
.foto{top:73px;right:121px;width:120px;z-index:1;}
.nota{top:160px;right:243px;width:120px;z-index:2;}
.foto img{width:98px;height:70px;}
div{background:white;border:1px solid black;padding:10px;}
.div1{height:90px;border-bottom:0;}
.div2{height:60px;border-top:0;}
</style></head><body>
<table>
<tr>
<td class="texto">texto grande</td>
<td class="foto"><div class="div1"><img></div></td>
<td class="nota"><div class="div2">nota</div></td>
</tr>
<tr>
<td class="texto">texto grande</td>
<td class="foto"><div class="div1"><img></div></td>
<td class="nota"><div class="div2">nota</div></td>
</tr>
</table></body></html> 
saludos