HTML Forum

**josil** · 05-05-2010, 07:31 PM

Hi
I have a table inside of another table:

Quote:

<table with=100% border="0">
<tr>
<td align="center">
<table with=95% border="0">
<tr>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
<td align="center"> some content</td>
</tr>
</td>
</tr>
</table>

Depending of a situation, all cells are filled with a certain value.
Using "if" statements, some of the cell’s are not shown, but sometimes all have values, making the cell’s to appear. When this happen, the total cells width, are larger than the table width, and the cell stretches horizontally throughout the monitor, getting out of the table, instead of dropping down, expanding the height of the table, and appearing vertically.
I cannot open and close, the middle cell’s with <tr>and ></tr>, due the fact, if a certain cell does not have any value, it leaves a empty space.
Can somebody give me a hint?
thanks

**LadynRed** · 05-06-2010, 02:33 PM

Can you post a LINK to the page or ALL the code?

Why are you using nested tables anyway?

**Madman340** · 05-06-2010, 09:44 PM

Have you tried using %'s instead of concrete width/height values?

**josil** · 05-07-2010, 03:32 PM

Hi people

thank you very much for your help

here it is the full code that I made. Sorry it is in portuguese!!!

Quote:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<?
include "call_DB.inc.php";
$sql2="select * from DB_TABLE where sale='1' and id=$id limit 1";
$resultado2=mysql_db_query("DB_NAME",$sql2) ;
$registo2=mysql_fetch_array($resultado2);
$id=$registo2["id"];
$referencia=$registo2["referencia"];
$freguesia=$registo2["freguesia"];
$cidade=$registo2["cidade"];
$codigopostal=$registo2["codigopostal"];
$estado=$registo2["estado"];
$pais=$registo2["country"];
$preco=$registo2["preco"];
$moeda=$registo2["moeda"];
$arealote=$registo2["arealote"];
$areaconstrucao=$registo2["areaconstrucao"];
$ano=$registo2["ano"];
$pisos=$registo2["pisos"];
$quartos=$registo2["quartos"];
$wc=$registo2["wc"];
$onsuite=$registo2["onsuite"];
$cozinha=$registo2["cozinha"];
$despensa=$registo2["despensa"];
$lavandaria=$registo2["lavandaria"];
$escritorio=$registo2["escritorio"];
$biblioteca=$registo2["biblioteca"];
$salajantar=$registo2["salajantar"];
$salaestar=$registo2["salaestar"];
$salacomum=$registo2["salacomum"];
$arcon=$registo2["arcon"];
$aqcen=$registo2["aqcen"];
$vaccum=$registo2["vaccum"];
$lareira=$registo2["lareira"];
$jacuzzi=$registo2["jacuzzi"];
$sauna=$registo2["sauna"];
$gym=$registo2["gym"];
$spa=$registo2["spa"];
$cave=$registo2["cave"];
$parqueamento=$registo2["parqueamento"];
$garagem=$registo2["garagem"];
$arrecadacao=$registo2["arrecadacao"];
$barbeque=$registo2["barbeque"];
$piscina=$registo2["piscina"];
$jardim=$registo2["jardim"];
$tenis=$registo2["tenis"];
$maid=$registo2["maid"];
$maidwc=$registo2["maidwc"];
$vista=$registo2["vista"];
$tvcabo=$registo2["tvcabo"];
$tvsatelite=$registo2["tvsatelite"];
$telefone=$registo2["telefone"];
$alarme=$registo2["alarme"];
$electricidade=$registo2["electricidade"];
$gas=$registo2["gas"];
$agua=$registo2["agua"];
$mobilado=$registo2["mobilado"];
$electro=$registo2["electro"];
$tipologia=$registo2["tipologia"];
$tipo=$registo2["tipo"];
?>
<table width='680' border='0' cellspacing='0' cellpadding='0' align="center">
<tr>
<td align='center'><img src='images/frames/img/fundo_top.png' width='680' height='16'/></td>
</tr>
<tr>
<td height='10' align='center' valign='top' style='background:url(images/frames/img/fundo1.png) repeat-y'>

<table width="650" border="0">
<tr>
<td align="center">PROPERTY DETAILS</td>
</tr>

</table>

<table width="630" border="1" bordercolordark="#33BA30" align="center">
<tr>
<? if ($arealote!="" and $arealote!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Plot Area</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$arealote"; ?></td>

<? } if ($arearustica!="" and $arearustica!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Rustic Area</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$arearustica"; ?></td>

<? } if ($areaconstrucao!="" and $areaconstrucao!="-") {?>

<td width='100' height='22' align='right' style='margin-right: 3'>Construction Area</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$areaconstrucao"; ?></td>

<? } if ($ano!="" and $ano!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Construction Year</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$ano"; ?></td>

<? } if ($pisos!="" and $pisos!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Floors</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$pisos"; ?></td>

<? } if ($quartos!="" and $quartos!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>BedRooms</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$quartos"; ?></td>

<? } if ($wc!="" and $wc!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>BathRooms</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$wc"; ?></td>

<? } if ($onsuite!="" and $onsuite!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>On Suite</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$onsuite"; ?></td>

<? } if ($cozinha!="" and $cozinha!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Kitchen</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$cozinha"; ?></td>

<? } if ($despensa!="" and $despensa!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Paintry</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$despensa"; ?></td>

<? } if ($lavandaria!="" and $lavandaria!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Laundry</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$lavandaria"; ?></td>

<? } if ($escritorio!="" and $escritorio!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Office Room</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$escritorio"; ?></td>

<? } if ($biblioteca!="" and $biblioteca!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Library</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$biblioteca"; ?></td>

<? } if ($salajantar!="" and $salajantar!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Dinning Room</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$salajantar"; ?></td>

<? } if ($salaestar!="" and $salaestar!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Living Room</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$salaestar"; ?></td>

<? } if ($salacomum!="" and $salacomum!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Lounge</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$salacomum"; ?></td>

<? } if ($arcon!="" and $arcon!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Air Conditioned</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$arcon"; ?></td>

<? } if ($aqcen!="" and $aqcen!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Central Heating</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$aqcen"; ?></td>

<? } if ($vaccum!="" and $vaccum!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Vaccum system</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$vaccum"; ?></td>

<? } if ($lareira!="" and $lareira!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Fire Place</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$lareira"; ?></td>

<? } if ($jacuzzi!="" and $jacuzzi!="-") { ?>

<td width='77' height='22' align='right' style='margin-right: 3'>Jacuzzi</td>
<td width='89' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$jacuzzi"; ?></td>

<? } if ($sauna!="" and $sauna!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Sauna</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$sauna"; ?></td>
</tr>

<? } ?>

<tr>

<? if ($gym!="" and $gym!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Gym</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$gym"; ?></td>

<? } if ($spa!="" and $spa!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Spa</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$spa"; ?></td>

<? } if ($cave!="" and $cave!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Basement</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$cave"; ?></td>

<? } if ($parqueamento!="" and $parqueamento!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Parking Place</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$parqueamento"; ?></td>

<? } if ($garagem!="" and $garagem!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Garage</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$garagem"; ?></td>

<? } if ($barbeque!="" and $barbeque!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>BBQ</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$barbeque"; ?></td>

<? } if ($piscina!="" and $piscina!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Pool</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$piscina"; ?></td>

<? } if ($jardim!="" and $jardim!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Garden</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$jardim"; ?></td>

<? } if ($tenis!="" and $tenis!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Tennis Court</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$tenis"; ?></td>

<? } if ($maid!="" and $maid!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Maid's Room</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$maid"; ?></td>

<? } if ($maidwc!="" and $maidwc!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Maid's WC</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$maidwc"; ?></td>

<? } if ($vista!="" and $vista!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Views</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$vista"; ?></td>

<? } if ($tvcabo!="" and $tvcabo!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Cable TV</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$tvcabo"; ?></td>

<? } if ($tvsatelite!="" and $tvsatelite!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Satelite TV</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$tvsatelite"; ?></td>

<? } if ($telefone!="" and $telefone!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Phone</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$telefone"; ?></td>

<? } if ($alarme!="" and $alarme!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Alarm</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$alarme"; ?></td>

<? } if ($electricidade!="" and $electricidade!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Electricity</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$electricidade"; ?></td>

<? } if ($gas!="" and $gas!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Gas</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$gas"; ?></td>
</tr>
<? } if ($agua!="" and $agua!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Water</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$agua"; ?></td>

<? } if ($mobilado!="" and $mobilado!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Furnished</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$mobilado"; ?></td>

<? } if ($electro!="" and $electro!="-") { ?>

<td width='100' height='22' align='right' style='margin-right: 3'>Appliances</td>
<td width='150' bgcolor='#FFFFFF' height='22' style='margin-left: 3'><? echo"$electro"; ?></td>
</tr>
<? } ?>

</table>
</td>
</tr>
<tr>
<td align='center'><img src='images/frames/img/fundo_bot.png' width='680' height='16'/></td>
</tr>
</table>
</html>

I hope that you understand!!!

thanks

**LadynRed** · 05-07-2010, 03:37 PM

Ok, so the reason you're using tables is because you're pulling from a database?

Style your tables using CSS, not all that in-line garbage. Get rid of the awful tags, again use CSS for styling text.

No matter what you do, the sum total of the parts can't be wider than it's parent. I think you may do better with percentages for widths rather than fixed values as you have them now, just as MadMan suggested.

**josil** · 05-07-2010, 05:25 PM

Quote:

Originally Posted by LadynRed

Ok, so the reason you're using tables is because you're pulling from a database?

Style your tables using CSS, not all that in-line garbage. Get rid of the awful tags, again use CSS for styling text.

No matter what you do, the sum total of the parts can't be wider than it's parent. I think you may do better with percentages for widths rather than fixed values as you have them now, just as MadMan suggested.

Good idea. Let me try

thanks

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!