Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   Javascript (http://www.velocityreviews.com/forums/f68-javascript.html)
-   -   collapsing space between hidden divs (http://www.velocityreviews.com/forums/t879295-collapsing-space-between-hidden-divs.html)

D. Alvarado 09-03-2004 09:24 PM

collapsing space between hidden divs
 
Hello

I have 5 divs, and initially the lower 4 are hidden. I would like
everything beneath the 5th div to appear flush against the first
visible div. But right now, there is a gap of white space between the
first visible div, and everything beneath the 5th. Here is this code:

<form name="f">
<div id="Item0">Item 1:<input type="text" size="32" maxlength="32"
name="Name0" id="Name0"></div>
<div style="visibility:hidden" id="Item1">Item: 2<input
type="text" size="32" maxlength="32" name="Name1" id="Name1"></div>
<div style="visibility:hidden" id="Item2">Item: 3<input
type="text" size="32" maxlength="32" name="Name2" id="Name2"></div>
<div style="visibility:hidden" id="Item3">Item: 4<input
type="text" size="32" maxlength="32" name="Name3" id="Name3"></div>
<div style="visibility:hidden" id="Item4">Item: 5<input
type="text" size="32" maxlength="32" name="Name4" id="Name4"></div>
<input type="button" value="Add Another" onClick="add();"
name="AddAnother">
</form>

How can I make the "Add Another" button flush against the first
visible div (i.e. eliminate all the white space between the first div
and the button), and then write a function "add" that sequentially
unhides each of the other divs, moving the "Add Another" button down
as well?

Thanks for all your help, - Dave

D. Alvarado 09-04-2004 02:25 PM

Re: collapsing space between hidden divs
 
Thanks! Go Sharks! -

sanjosewebguy@aol.com.nospam (SanJoseWebGuy) wrote in message news:<20040904013755.24921.00001777@mb-m20.aol.com>...
> Dave,
> Using visibility:hidden will allow a hidden div 'box' to occupy white space in
> the html document; whereas, using display:none will render the box not visible
> AND not occupy white space. Unless there's some special reason for it, I'd
> recommend using display:block (to view) or display:none (to render invisible).
> There's also display:inline which will allow visibility. As the attribute
> values 'block' and 'inline' imply, they allow the element to exist on it's own
> line (block) or on the same line as its preceding elements (inline).
>
> Hope this helps,
>
> Jim



All times are GMT. The time now is 07:13 PM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.