DIV-hjälp

Divtaggarna som är fetmarkerade hänger inte med med sin bakgrund när sidan växer på höjden.. det är skuggkanter i kanterna på sidan. dom blir bara 1px höga ser det ut som.. så lägger jag in en bild i innehållet på sidan så växer bilden förbi bakgrunden.
Svårt att förklara men hoppas ni förstår.. vill alltså att divtaggarna som jag fetmarkerat ska hänga med sidan på höjden.. vilket alltså inte sker.

hoppas någon kan lösa det
MVH
Daniel

Koden ser ut ungefär såhär: bakgrundsbilderna som har bokstaven l i slutet är left, r är right samt m är mitten.

<table align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><div id="top_l" style="width: 16px; height: 28px; background-image:url(top_l.png)">

</div></td>
<td>
<div id="top_m" style="width: 920px; height: 28px; background-image:url(top_m.png)">

</div>
</td>
<td>
<div id="top_r" style="width: 15px; height: 28px; background-image:url(top_r.png)">

</div>
</td>
</tr>
<tr>
<td valign="top">
<div id="bg_l" style="width: 16px; height: 404px; background-image:url(bg_l.png); background-repeat:repeat-y"></div>
<div id="bg_ln" style="width: 16px; height: auto; background-image:url(bg_ln.png); background-repeat:repeat-y">

</div>
</td>
<td>
<div id="bg_m" style="width: 920px; background:#E7E7E7">
<table width="100%" border="0" cellpadding="0" cellspacing="0" id="meny">
<tr>
<td>
<div id="meny_l" style="width: 14px; height: 57px; background-image:url(meny_l.png)">

</div></td>
<td>
<div id="meny_m" style="width: 893px; height: 57px; background-image:url(meny_m.png); background-repeat:repeat-x">
<table width="100%" height="56" border="0" cellpadding="0" cellspacing="0" align="center" id="menyknappar">
<tr>
<td>
<div align="center">
Testar menypostionen
</div></td>
</tr>
</table>
</div>
</td>
<td>
<div id="meny_r" style="width: 13px; height: 57px; background-image:url(meny_r.png)">

</div>
</td>
</tr>
<tr>
<td colspan="3">
<div id="sidinnehall">
<br />
<table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" id="sidinnehalltabell">
<tr>
<td align="left" valign="top"><img src="bilder/startbildjocke.jpg" alt="Jocke" width="235" height="550" /></td>
<td width="173" valign="top" id="tabellruta">
<div style="width: 173px; height: 44px; background-image:url(bilder/tabell_top.png)"> </div>
<div style="width: 173px; height: auto; background-image:url(bilder/tabell_mitt.png)">

</div>
<div style="width: 173px; height: 11px; background-image:url(bilder/tabell_bott.png)">
</div>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>

</div>
</td>
<td valign="top">
<div id="bg_r" style="width: 15px; height: 404px ; background-image:url(bg_r.png); background-repeat:repeat-y"></div>
<div id="bg_rn" style="width: 15px; height: auto ; background-image:url(bg_rn.png); background-repeat:repeat-y">

</div>
</td>
</tr>
<tr>
<td><div id="botten_l" style="width: 16px; height: 22px; background-image:url(botten_l.png)">

</div></td>
<td>
<div id="botten_m" style="width: 920px; height: 22px; background-image:url(botten_m.png); background-repeat:repeat-x">

</div>
</td>
<td>
<div id="botten_r" style="width: 15px; height: 22px; background-image:url(botten_r.png)">

</div>
</td>
</tr>
</table>

lärde mig att göra transparent png som bakgrund för skuggan.. nu blir koden enklare då det räcker med en div för hela sidans innehåll under menyn..
så det är löst