growing <div>s

Discussion in 'HTML' started by jason@cyberpine.com, Sep 25, 2006.

  1. Guest

    Two <div> areas side by side. When one grows downward, I'd like the
    other to do so as well. Any way to do this as well. I tried nesting,
    but no success.
    , Sep 25, 2006
    #1
    1. Advertising

  2. Andy Dingley Guest

    wrote:

    > Two <div> areas side by side. When one grows downward, I'd like the
    > other to do so as well.


    This is table-style behaviour and isn't supported by the HTML / CSS
    flow model.

    If it's important to you, then use a <table>. I wouldn't use the table
    display properties in CSS, as they're poorly supported.

    The alternatives tend to involve either JavaScript, or setting rigid
    sizes onto elements. Overall I see the table approach as being
    preferable. If you're insistent that adjacent elements maintain
    relative sizing, then you're already committing yourself to table-like
    concepts.
    Andy Dingley, Sep 25, 2006
    #2
    1. Advertising

  3. Guest

    Rigid might work so long as the areas are individually scrollable when
    they outgrow the set. I wonder how I can do that. I'm using an asp.net
    2.0 contentplaceholder inside the div, which varies in size based on
    content.

    Andy Dingley wrote:
    > wrote:
    >
    > > Two <div> areas side by side. When one grows downward, I'd like the
    > > other to do so as well.

    >
    > This is table-style behaviour and isn't supported by the HTML / CSS
    > flow model.
    >
    > If it's important to you, then use a <table>. I wouldn't use the table
    > display properties in CSS, as they're poorly supported.
    >
    > The alternatives tend to involve either JavaScript, or setting rigid
    > sizes onto elements. Overall I see the table approach as being
    > preferable. If you're insistent that adjacent elements maintain
    > relative sizing, then you're already committing yourself to table-like
    > concepts.
    , Sep 25, 2006
    #3
  4. Guest

    looks like this will do it overflow:auto;">


    <div style="position:absolute;
    left:100px;
    top:100px;
    width:100px;
    height:100px;
    background-color:#ffffff;
    overflow:auto;">
    </div>

    wrote:
    > Two <div> areas side by side. When one grows downward, I'd like the
    > other to do so as well. Any way to do this as well. I tried nesting,
    > but no success.
    , Sep 25, 2006
    #4
  5. richard Guest

    <> wrote in message
    news:...
    > looks like this will do it overflow:auto;">
    >
    >
    > <div style="position:absolute;
    > left:100px;
    > top:100px;
    > width:100px;
    > height:100px;
    > background-color:#ffffff;
    > overflow:auto;">
    > </div>


    Yeah that should work but I'd drop the height.
    Have you tried doing the same thing but with a "container" division for
    both?
    Use the above style for the container as well and see what happens.
    Instead of inline, do the style in the <head>.
    Then you'd show something like:

    <div id="container">
    <div id="box1">hello</div>
    <div id="box2">goodbye</div>
    </div>

    The idea behind the container is to keep the boxes from breaking when not
    desired.
    richard, Sep 25, 2006
    #5
  6. Toby Inkster Guest

    Andy Dingley wrote:

    > This is table-style behaviour and isn't supported by the HTML / CSS
    > flow model.


    It is -- it's just not supported by Internet Explorer.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Sep 25, 2006
    #6
  7. Andy Dingley Guest

    Toby Inkster wrote:

    > Andy Dingley wrote:
    >
    > > This is table-style behaviour and isn't supported by the HTML / CSS
    > > flow model.

    >
    > It is -- it's just not supported by Internet Explorer.


    Sorry - I worded that poorly.

    IE and FF both support "CSS table style" behaviour, although it's (not
    entirely unreasonably) only reliably available for the <table> element.
    IE doesn't support the CSS display property setting display: table-*;
    on other elements.

    What I should have said is that you're reduced to using tables (and
    arguably mis-using them) because what you really need here is
    "newspaper column" layout and HTML / CSS doesn't support that at all.
    Although XSL:FO can do it (for many output formats).
    Andy Dingley, Sep 25, 2006
    #7
    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. growing <div>

    , Sep 25, 2006, in forum: ASP .Net
    Replies:
    1
    Views:
    462
    Cowboy \(Gregory A. Beamer\)
    Sep 25, 2006
  2. Replies:
    0
    Views:
    412
  3. saurabh9
    Replies:
    2
    Views:
    581
    Bergamot
    Oct 10, 2008
  4. K Viltersten

    <div ... /> and <div ...></div>

    K Viltersten, Mar 30, 2009, in forum: ASP .Net
    Replies:
    4
    Views:
    737
  5. Dwayne Madsen

    Q: Div A inside Div B is larger than Div B

    Dwayne Madsen, Jun 1, 2005, in forum: Javascript
    Replies:
    1
    Views:
    182
    David Dorward
    Jun 1, 2005
Loading...

Share This Page