relative div tags within a table cell?

[cajmilfo]

Hello folks,
it look like table / div tag relative positioning problem, let say I have a table that has 3x3 cells and the middle one is the main one. Here i want to create few layers that I will position relatively to the cell tag. When I put the first div tag everything is ok, but then the next tag it creates a blank rectangle with size of the layer under the previous layer. Dont know why and dunno how to get rid of it.
Why am I putting div into a table? Because the table makes it nicely centered. Dont know how to make centered div tag cause i need to put another div tags relatively to the main div tag.

Please help me.

code snippet:

'<table width="100%" height="100%" cellpadding=0 cellspacing=0 border=1>'+
'<tr>'+
'<td colspan=3 width="100%" height="30%">'+
'</tr>'+
'<tr>'+
'<td width="20%" height="40%">'+
'</td>'+
'<td width="60%" height="40%">'+
'<div id="Oval" style="position:relative; left:0px; top:0px; width:1000px; height:683px; z-index:3">'+
'<img src="oval 2.png" style="width: 1000px; height: 683px;" galleryimg="false"/>'+
'</div>'+
'<div id="layerforum" style="position:relative; left:1px; top:-500px; width:134px; height:143px; z-index:4">'+
'<img src="forum.png" style="width: 134px; height: 143px;" galleryimg="false"/>'+
'</div>'+
'<div id="layergaleria" style="position:relative; left:0px; top:-509px; width:174px; height:134px; z-index:4">'+
'<img src="galeria.png" style="width: 174px; height: 134px;" galleryimg="false"/>'+
'</div>'+
'<div id="layerhistoria" style="position:relative; left:0px; top:-500px; width:199px; height:112px; z-index:4">'+
'<img src="historia.png" style="width: 199px; height: 112px;" galleryimg="false"/>'+
'</div>'+
'<div id="layerinfo" style="position:relative; left:0px; top:-504px; width:166px; height:117px; z-index:2">'+
'<img src="info.png" style="width: 166px; height: 117px;" galleryimg="false"/>'+
'</div>'+
'<div id="logo" style="position:relative; left:0px; top:-975px; width:885px; height:302px; z-index:5">'+
'<img src="logo.png" style="width: 885; height: 302px;" galleryimg="false"/>'+
'</div>'
'</td>'+
'<td width="20%" height="40%">'+
'</td>'+
'</tr>'+
'<tr>'+
'<td colspan=3 width="100%" height="30%">'+
'</tr>'+
'</table>';

[WebGeek]

I think your running in to a inline vs. block type issue. You might want to try to use span. I will run some tests and see if I can't get your snipit to bend to my will.