Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 9 of 9

Thread: div auto height

  1. #1
    Member ravage's Avatar
    Join Date
    Apr 2011
    Posts
    92
    Member #
    27355
    Liked
    2 times
    so i have one div placed inside a larger div on a page. the inner div expands vertically when more content is added to it. i want the larger (outer containing) div to expand vertically depending on the length of the content placed inside it.

    inner div: #content {
    position: relative;
    background: #ffffff;
    width: 761px;
    top: -580px;
    left: 192px;
    /*min-height: 460px;*/
    height: auto !important;
    /*height: 460px;*/
    margin-bottom: 6px;
    }

    outer div: #borderFrame {
    position: relative;
    margin: 0px 0px;
    /*min-height: 812px;*/
    height: auto;
    /*height: 460px;*/
    background: url(img/layout/contentRepeatableBackground.jpg) 0 0 repeat;
    border-style: solid;
    border-width: 1px;
    border-color: #eeeab0;
    }

    how do I achieve this?

  2.  

  3. #2
    Senior Member Ganners's Avatar
    Join Date
    Feb 2011
    Location
    United Kingdom
    Posts
    415
    Member #
    27007
    Liked
    92 times
    Well yes you have your height set to auto and that will do it. The problem I can see is that you're relatively positioning inside of the div, with an amount which will overflow it's container div. I don't see any purpose behind it really! What are you trying to achieve exactly?
    Mark Gannaway Software Developer

    Recent Experiments
    - Backpropogation Neural Network language solving (http://ann.ganners.co.uk/)
    - Animated image to ASCII (http://google.ganners.co.uk/)
    - 3D Paper Characters (http://cybergame.ganners.co.uk/)
    - Anagram solving (http://roflol.co.uk/)

  4. #3
    Member ravage's Avatar
    Join Date
    Apr 2011
    Posts
    92
    Member #
    27355
    Liked
    2 times
    i'm trying to get it so when content is added to the container div (thus increasing its length), then the parent container increases in length as well.

  5. #4
    Senior Member Ganners's Avatar
    Join Date
    Feb 2011
    Location
    United Kingdom
    Posts
    415
    Member #
    27007
    Liked
    92 times
    It does do that already though. But it may also depend on what's inside the div. You could add to both of them "overflow: hidden;" then that will allow the div to contain floats.
    Mark Gannaway Software Developer

    Recent Experiments
    - Backpropogation Neural Network language solving (http://ann.ganners.co.uk/)
    - Animated image to ASCII (http://google.ganners.co.uk/)
    - 3D Paper Characters (http://cybergame.ganners.co.uk/)
    - Anagram solving (http://roflol.co.uk/)

  6. #5
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    Quote Originally Posted by Ganners, post: 226456
    It does do that already though. But it may also depend on what's inside the div. You could add to both of them "overflow: hidden;" then that will allow the div to contain floats.
    I don't think we're looking at the old float issue, here. This stands out to me:
    top: -580px;

    What is that about?
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  7. #6
    WDF Staff m3n0tu18's Avatar
    Join Date
    Jul 2011
    Location
    Devon, UK
    Posts
    1,473
    Member #
    28473
    Liked
    265 times
    I think for us to get a proper understanding of the issue could you upload the site you are working on to a free host and send us the link with the issue.

    If i am right though you might need to add a <div style="clear:both;"></div> to the bottom of the inner container (just above the outercontainer ending /div)
    If you like my comments to your thread please click the LIKE button

    Check out my portfolio: Here!
    View my company Facebook Page
    View my company Website

    <<Plrease ignoer my typo's I have isdexlyia>>

  8. #7
    Member ravage's Avatar
    Join Date
    Apr 2011
    Posts
    92
    Member #
    27355
    Liked
    2 times
    thanks guys but i fixed it. sorry for not posting the solution sooner. cheers for the help.

  9. #8
    WDF Staff m3n0tu18's Avatar
    Join Date
    Jul 2011
    Location
    Devon, UK
    Posts
    1,473
    Member #
    28473
    Liked
    265 times
    Quote Originally Posted by ravage, post: 227286
    thanks guys but i fixed it. sorry for not posting the solution sooner. cheers for the help.
    Could you respond telling us how you fixed the issue? It would help others that might get into your position with this issue. Thanks - M3
    If you like my comments to your thread please click the LIKE button

    Check out my portfolio: Here!
    View my company Facebook Page
    View my company Website

    <<Plrease ignoer my typo's I have isdexlyia>>

  10. #9
    Member ravage's Avatar
    Join Date
    Apr 2011
    Posts
    92
    Member #
    27355
    Liked
    2 times
    just the improper use of the positioning. i was using relative for some and absolute for other elements. silly mistake i made at the end of a long day


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:59 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com