Placing multiple objects in different areas of a table cell

Nathan Sokalski

unread,

Jul 26, 2001, 5:02:08 PM7/26/01

to

I want to place graphics in the 4 corners of a cell, even if they overlap
with something else in the cell (in otherwords, positioned relative to the
cell border). How do I place the graphics in the corners without affecting
the rest of the cell?
--
Nathan Sokalski
njsok...@hotmail.com

Rowland Shaw

unread,

Jul 27, 2001, 4:24:18 AM7/27/01

to

Use absolute positioning
with something like:

I hasten to add, but that code is untested, although I believe it to be
correct (although I expect you'd need to add heights/widths where
appropriate)

Absolute positioning is relative to the parent block (the TD, in this case)
and takes it out of normal flow...

"Nathan Sokalski" <njsok...@hotmail.com> wrote...

Manfred Braun

unread,

Jul 27, 2001, 3:09:54 PM7/27/01

to

Hi All,

sorry, I cannot agree. If you specify the TDs content as absolute, it is
positioned
absolute on the page, not the TD. To make the positioned in the cell itself,
you
have to define them "relative". This is the predecessor, the TD in this
case. I'll put
a simle sample at the end.

Hope, this helps.

Best regards,
Manfred Braun

(Private)
Lange Roetterstrasse 7
D68167 Mannheim
Germany

mailto:_mbr...@manfred.mannheim-netz.de
(Remove the anti-spam-underscore to mail me!)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML>
<!--

Name: TestPositionedTableCellContent1.htm
Author: mb
Date: 27.07.2001
Purpose: Check, if one needs relative or abolsute positioning to position
elements in a cell, but relative to the cell's position.

-->

<HEAD>

table, tbody, td
{
border:solid 2 dimgray;
}

td
{
vertical-align:top;
width:200;
height:200;
}

div.clsElemRel
{
position:relative;
display:inline;
}

</style>

<TITLE>TestPositionedTableCellContent1</TITLE>

</HEAD>

<BODY>

<h4>TestPositionedTableCellContent1</h4>

<p>
Purpose:Check, if one needs relative or abolsute positioning to position
elements in a cell, but relative to the cell's position.
</p>

<table>
<tbody>
<tr>
<td>Simple text in cell (R0C0)</td>
<td>
<div class="clsElemRel" style="top:20;left:60;">div1</div>
</td>
</tr>

<tr>
<td>

<div class="clsElemRel" style="top:0;left:0;">div1</div>
<div class="clsElemRel" style="top:0;left:50;">div2</div>
<div class="clsElemRel" style="top:50;left:-50;">div3</div>
<div class="clsElemRel" style="top:50;left:50;">div4</div>
</td>
<td>Simple text in cell (R1C1)</td>
</tr>

</tbody>
</table>

</BODY>

</HTML>

"Rowland Shaw" <spamf...@anotherpointless.org> wrote in message
news:egDHJWnFBHA.2088@tkmsftngp07...

Nathan Sokalski

unread,

Jul 28, 2001, 3:24:29 AM7/28/01

to

I agree that you need position:relative; but in your example you need a
specific width and height for the cells. But I do not want to have a
specific width and height. Therefore, your method will not work in my case.
Thanks anyway.
--
Nathan Sokalski
njsok...@hotmail.com

"Manfred Braun" <mbr...@manfred.mannheim-netz.de> wrote in message
news:#w$6a7sFBHA.1712@tkmsftngp04...

Manfred Braun

unread,

Jul 28, 2001, 2:50:35 PM7/28/01

to

Hi,

you are right - sorry, I forget that wish.....But now, I see no
chance.....BTW, the height and width in my sample are NOT neccesary, they
are only there, to have space enough for the inner elements. But you cannot
extend the cell's width and height through positioned elements.... :-(

Best regards,
Manfred Braun

(Private)
Lange Roetterstrasse 7
D68167 Mannheim
Germany

mailto:_mbr...@manfred.mannheim-netz.de
(Remove the anti-spam-underscore to mail me!)

"Nathan Sokalski" <njsok...@hotmail.com> wrote in message
news:#BVmZZzFBHA.1372@tkmsftngp04...

Rowland Shaw

unread,

Jul 30, 2001, 6:23:58 AM7/30/01

to

I'd refer you to the CSS2 spec, notably:
http://www.w3.org/TR/REC-CSS2/visuren.html#positioning-scheme

To quote, "Absolute positioning. In the absolute positioning model, a box is
removed from the normal flow entirely (it has no impact on later siblings)
and assigned a position with respect to a containing block."

Perhaps you were thinking of "fixed" postioning?

"Manfred Braun" <mbr...@manfred.mannheim-netz.de> wrote...

> sorry, I cannot agree. If you specify the TDs content as absolute, it is
> positioned
> absolute on the page, not the TD. To make the positioned in the cell
itself,
> you have to define them "relative". This is the predecessor, the TD in
this
> case.

[sample snipped]