Using <div> to cover page contents

[lilOlMe]

I'm using Ajax to help make my webpage appear to be smoother.

When a control has submitted, I would like to prevent any controls within that control from resubmitting until the request has completed.

Because my forum has many buttons on it, it would take a long time to disable each one upon submitting the forum (using JavaScript).

So instead, I plan on using a <div> that will "shield" my buttons and prevent the user from clicking any button under that <div>.

My problem is that I can't seem to get this <div> to display over the content.

Eg (simplified example)
[code=html]
<div id="theContaine rOfMyControls">
<div id="theButtonSh ieldingDiv" style="backgrou nd-color:black; position:absolu te; height:100%; width:100%; display:none;"> </div>
<!-- a bunch of other <div>s containing buttons are here that I need to "cover up" -->
</div>
[/code]

So, basically I set the display of the "theButtonShiel dingDiv" from "none" to "block" when the page is submitted to the server.

This will cover the entire contents of the screen that's being displayed; however, when the user scrolls down, the section previously hidden is not covered by the <div>...makin g it still possible for the user to submit the page more than once.

Is there a way to make the "theButtonShiel dingDiv" span the contents of "theContainerOf MyControl" instead of the whole page?

(Basically I'd like to use "position:relat ive" but I'm not having luck with this)

If this isn't possible, is there a way to make sure that the <div> is 100% of the content instead of 100% of the page content being displayed?

Any suggestions are welcome!

Thanks a lot
-LilOlMe

[drhowarddrfine]

I have to think about this (as I'm walking out the door) but I just closed a thread a few minutes ago that I think is related. Check that one out. "How to place a div on top of another div"

[lilOlMe]

I have to think about this (as I'm walking out the door) but I just closed a thread a few minutes ago that I think is related. Check that one out. "How to place a div on top of another div"

I saw the thread that you just closed.
It still doesn't help me.

I learned that the "position:absol ute" does work relative to it's parent container but only if you don't set the top, bottom, left, or right css attributes.

I'm still experiencing a problem with the "covering" <div> not becoming height:100% of the containing <div>...it only goes to the bottom of the browser and when you scroll down the rest of the page is still visible.

Thanks for your help,

-LilOlMe

[Death Slaught]

Try giving your division a z-index of 100.

Hope it helps, Thanks,
{\_/}
(' . ')
(")[DEATH](")
(")(")