M
mj.redfox.mj
Hi,
I wonder if someone can help me. Re my code below, I'm trying to
position some divs within table elements. What I'd like to do is for
each table row to contain a group of positioned divs. The problem I
have is that whereas I'd like the table row to somehow automatically
expand its height to contain all the divs in it (in the same way a
table normally does whenever text etc is entered into it),
unfortunately it doesn't appear to do this, and any subsequent rows
appear underneath the divs from the previous row.
Does anyone know how I can get the table row/columns to recognize the
height of the (albeit absolutely positioned) divs that they contain?
<table width="100%">
<tr>
<td width="100%" style="position: relative">
<div style="position: absolute; left: 4px; top: 4px; z-index:
30; width: 100%">
<!-- CODE BLOCK 1 GOES HERE -->
</div>
<div style="position: absolute; left: 24px; top: 24px; z-index:
20; width: 100%">
<!-- CODE BLOCK 2 GOES HERE -->
</div>
</td>
</tr>
<tr>
<td width="100%" style="position: relative">
<div style="position: absolute; left: 4px; top: 4px; z-index:
30; width: 100%">
<!-- CODE BLOCK 3 GOES HERE -->
</div>
<div style="position: absolute; left: 24px; top: 24px; z-index:
20; width: 100%">
<!-- CODE BLOCK 4 GOES HERE -->
</div>
</td>
</tr>
</table>
I wonder if someone can help me. Re my code below, I'm trying to
position some divs within table elements. What I'd like to do is for
each table row to contain a group of positioned divs. The problem I
have is that whereas I'd like the table row to somehow automatically
expand its height to contain all the divs in it (in the same way a
table normally does whenever text etc is entered into it),
unfortunately it doesn't appear to do this, and any subsequent rows
appear underneath the divs from the previous row.
Does anyone know how I can get the table row/columns to recognize the
height of the (albeit absolutely positioned) divs that they contain?
<table width="100%">
<tr>
<td width="100%" style="position: relative">
<div style="position: absolute; left: 4px; top: 4px; z-index:
30; width: 100%">
<!-- CODE BLOCK 1 GOES HERE -->
</div>
<div style="position: absolute; left: 24px; top: 24px; z-index:
20; width: 100%">
<!-- CODE BLOCK 2 GOES HERE -->
</div>
</td>
</tr>
<tr>
<td width="100%" style="position: relative">
<div style="position: absolute; left: 4px; top: 4px; z-index:
30; width: 100%">
<!-- CODE BLOCK 3 GOES HERE -->
</div>
<div style="position: absolute; left: 24px; top: 24px; z-index:
20; width: 100%">
<!-- CODE BLOCK 4 GOES HERE -->
</div>
</td>
</tr>
</table>