Positioning divs, but WITHIN table cells?

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>
 
E

Els

Does anyone know how I can get the table row/columns to recognize the
height of the (albeit absolutely positioned) divs that they contain?

Nope, they just won't.
Instead of using position:absolute, give the table cells the desired
left and top padding.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top