collapsing space between hidden divs

Discussion in 'Javascript' started by D. Alvarado, Sep 3, 2004.

  1. D. Alvarado

    D. Alvarado Guest

    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, Sep 3, 2004
    #1
    1. Advertising

  2. D. Alvarado

    D. Alvarado Guest

    Thanks! Go Sharks! -

    (SanJoseWebGuy) wrote in message news:<>...
    > 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
     
    D. Alvarado, Sep 4, 2004
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Neil Monk

    space between CSS divs - how?

    Neil Monk, Jul 26, 2004, in forum: HTML
    Replies:
    4
    Views:
    741
    Neil Monk
    Jul 27, 2004
  2. JL
    Replies:
    7
    Views:
    651
    dorayme
    Sep 15, 2007
  3. Chris K.
    Replies:
    4
    Views:
    890
    Bergamot
    Jun 4, 2008
  4. Wells
    Replies:
    2
    Views:
    345
  5. Replies:
    1
    Views:
    280
Loading...

Share This Page