Enable newly displayed div to overlay page content?

[gorilla1]

I have a div that is not visible (display: none) and at some point when it is activated I change it to visible (display: block). This works fine. However, when it becomes visible, it pushes other content on the page down, whereas I want it to overlay the other content. I have searched around and tried to emulate what I saw done in other applications, but with no success. How do I do this? Here is how the div is coded:

<div align="left" name="test" style="font-family:Arial; font-size:12px; width:462px; border:#000000 solid 1px; padding:3px; display: none; height:140px; overflow: auto; "></div>

G

[mark87]

Use visibility: hidden and visibility: visible instead.

[SpirtOfGrandeur]

Overlaying the other content you are going to want to mess around with absolute positioning and also z-index.

[gorilla1]

Thanks much, but can someone point me to an example? I have tried z-index and visibility and cant get it set up to work. I have looked at dropdown menu code that is css-based, but generally these use li ul and hover attributes, etc -- I just want to have this scrollable div appear and disappear over existing content.

G