2 replies [Last post]
ergos
Offline
newbie
Last seen: 16 years 11 weeks ago
Timezone: GMT-6
Joined: 2004-08-13
Posts: 2
Points: 0

I have a form that has a two radio options on it. When the user selects option one, it makes the first of two div's visible that has some questions on it for the user to fill out that's appropriate for that option. When the user selects the second option, the first div hides and the second div becomes visible.

I have all of the javascript working for it but my problem is I want the two divs to be overlapping so there is not a huge area of whitespace for the hidden one.

I can't use absolute positioning because the top of the page is dynamically generated content so I'm not sure how far down the text above it will go.

How would I go about setting up these two divs so that they overlap not using absolute positioning? Only one div needs to be visible at a time. Also, it needs to be able to run on FireFox. Please, no IE only code. Thanks for any help you can provide.

rtm223
rtm223's picture
Offline
Enthusiast
Last seen: 16 years 23 weeks ago
Joined: 2004-05-18
Posts: 58
Points: 0

Creating overlapping divs (on purpose)

try using:
display:none;anddisplay:block;

instead of what I assume you are using:visibility:hidden;andvisibility:visible;

This will collapse the invisible div eliminating any whitespace. Hope this helps.

css layout tutorials - in depth layout tutorials for all you newbies D maybe even some stuff for you not-so-new-bies out there P

ergos
Offline
newbie
Last seen: 16 years 11 weeks ago
Timezone: GMT-6
Joined: 2004-08-13
Posts: 2
Points: 0

Creating overlapping divs (on purpose)

That worked beautifully. Thank you! Laughing out loud