rel vs. abs positioning

I hate sounding like an idiot, but I hope someone can help me figure
this out:

I have a hidden div (which overlays other stuff) that I toggle on and
off, and I have it positioned absolutely so it sits outside the normal
flow and doesn't screw the rest of the layout. However, I'd like to be
able to specify (x,y) where it sits in relation to the td cell holding
the div, and NOT in relation to the browser window, which seems to be
the only way when using left, top, etc. I'd like to be able to do this
since the table may not always be used in the placement in which it was
designed--it may get used in some other part of some other layout
unbeknownst to me.

I guess I'm looking for a relative absolute. Any thoughts? (besides
"forget about it") Thanks in advance!

<kehr (AT) NOSPAM (DOT) bellsouth.net> wrote

Hi David,

I've tried relative for the td and absolute for the div, and it seems to
work for IE, but it looks like NS7 unhides the div positioned relative
to the window. Just FYI, I am declaring style settings within the tags,
but when I put them in the style header as...

#secret td { position: relative; }
#secret div { position: absolute; top: 10px; left: 20px; }

...with...

td id="secret"
div

...it actually positions the div absolutely with reference to the window
for both browsers. So, I'm not sure what I'm doing wrong. Help! You
can see what I'm working with at
http://www.archifexinc.com/clients/imi/rose02.html -- I inherited the
show/hide script it uses to toggle the div on-and-off. I'm sure there's
a better way to do this. Any suggestions?

Well first off looking at the code, I found no <td id="secret">. Looking at
the code, I assume it's suppose to be the one with the
style="position:relative;" attribute but that you took it out because it
wasn't working.

In that case the problem is that the selector you need for the first rule is
"#secret" not "#secret td". The selector you gave is looking for a td inside
#secret which means that it matches the td's inside the table inside the
div, hence the <td id="secret"> still has a position of static as well as
all of its ancestors which is why the div is positioned with respect to the
window.

You could also have problems if you had a div inside your div as it would
make those inner div's also be positioned. It would be nice if IE supported
the CSS2 child selctor because then you would be able to use #secret > div
to solve the problem. insted you'll need to use #secret #SecretStuff if you
wish to be safe as the selector for the CSS rule.

Net result, put the id="secret" back in place and use:
#secret { position: relative; }
#secret #SecretStuff { position: absolute; top: 10px; left: 20px; }

Ernest Cline wrote:

kehr (AT) NOSPAM (DOT) bellsouth.net> wrote in message
news:3EFA0825.C02911FD (AT) NOSPAM (DOT) bellsouth.net...
Hi David,

I've tried relative for the td and absolute for the div, and it seems to
work for IE, but it looks like NS7 unhides the div positioned relative
to the window. Just FYI, I am declaring style settings within the tags,
but when I put them in the style header as...

#secret td { position: relative; }
#secret div { position: absolute; top: 10px; left: 20px; }

...with...

td id="secret"
div

...it actually positions the div absolutely with reference to the window
for both browsers. So, I'm not sure what I'm doing wrong. Help! You
can see what I'm working with at
http://www.archifexinc.com/clients/imi/rose02.html -- I inherited the
show/hide script it uses to toggle the div on-and-off. I'm sure there's
a better way to do this. Any suggestions?

Well first off looking at the code, I found no <td id="secret">. Looking at
the code, I assume it's suppose to be the one with the
style="position:relative;" attribute but that you took it out because it
wasn't working.

In that case the problem is that the selector you need for the first rule is
"#secret" not "#secret td". The selector you gave is looking for a td inside
#secret which means that it matches the td's inside the table inside the
div, hence the <td id="secret"> still has a position of static as well as
all of its ancestors which is why the div is positioned with respect to the
window.

You could also have problems if you had a div inside your div as it would
make those inner div's also be positioned. It would be nice if IE supported
the CSS2 child selctor because then you would be able to use #secret > div
to solve the problem. insted you'll need to use #secret #SecretStuff if you
wish to be safe as the selector for the CSS rule.

Net result, put the id="secret" back in place and use:
#secret { position: relative; }
#secret #SecretStuff { position: absolute; top: 10px; left: 20px; }

Thanks Ernest -- that made sense, but I tried it to no avail. IE
accepts it, but my NS7 still renders the div in relation to the window.
I even tried putting the id="secret" in the tr, also, just to see. I'm
going nuts!