How to increse height of 2 div layers automatically

Discussion in 'CSS' started by vic_msn, May 26, 2007.

  1. #1
    I have a left and right div inside a wrapper
    the right is the content and left is navigation
    suppose the article/content is very large the right is increased automatically and I also make the left layer to adjust correspondingly. ?
     
    vic_msn, May 26, 2007 IP
  2. Katy

    Katy Moderator Staff

    Messages:
    3,490
    Likes Received:
    513
    Best Answers:
    7
    Trophy Points:
    355
    #2
    Maybe set the height to 100% ?
     
    Katy, May 26, 2007 IP
  3. AdamSee

    AdamSee Well-Known Member

    Messages:
    422
    Likes Received:
    28
    Best Answers:
    0
    Trophy Points:
    135
    #3
    Hmm. If you want the background-image to increase, you can attach an image to the #wrapper (repeat-y) and then apply overflow:hidden. If you want them actually be the same size, the method used is slighly more tricky for good browser support. For the left and right div apply: padding-bottom: 32767px; margin-bottom: -32767px; also applying overflow:hidden to the wrapper. Have a good read through this page to make sure you add the necessary browser fixes when needed: http://www.positioniseverything.net/articles/onetruelayout/equalheight#impossible_layouts
     
    AdamSee, May 26, 2007 IP
  4. RichardKnox

    RichardKnox Peon

    Messages:
    209
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Thats a terrible method to do it. It seems the most logical, results are DISASTEROUS! If its two colours for example make an image with the correct column widths and the two colours and then set that as the background of your wrapper DIV. This is the only way i've found for all browsers to render it correctly.

    Thanks,
    Rich
     
    RichardKnox, May 28, 2007 IP
  5. AdamSee

    AdamSee Well-Known Member

    Messages:
    422
    Likes Received:
    28
    Best Answers:
    0
    Trophy Points:
    135
    #5
    The method works on every modern browser and produces brilliant results - It's totally fine mate :)
     
    AdamSee, May 29, 2007 IP
  6. Ragnhild

    Ragnhild Peon

    Messages:
    28
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #6
    I agree that the image method is the best, just make an image with the colours you want and make this the background image. Make sure to make it just a few pixels in height and have it repeat itself vertically, that way you will cover the whole background without increasing the loading time. This is the method I use for my column designs.
     
    Ragnhild, May 29, 2007 IP