Column Menu hieght %100 liquid problem

Discussion in 'CSS' started by xeongx, Jul 31, 2007.

  1. #1
    Hello,
    I'm coding a template and facing a problem.
    This is the situation:
    
    <div id="content>
        <div id="left">Left Menu</div>
        <div id="middle">Content</div>
        <div id="right">Right Menu</div>
    </div>
    
    HTML:
    I want the height for all left, middle and right divs to be %100.
    I've tried to search the internet for a solution, found many but none worked.
    [​IMG]
    The arrows mean that the div should extend to the bottom of the screen.

    Can anybody help?
     
    xeongx, Jul 31, 2007 IP
  2. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
  3. xeongx

    xeongx Peon

    Messages:
    54
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanks,
    I was thinking of this solution too,
    Now I'm facing another problem.
    When I set the left, middle and right divs to float left, and float right.
    the background which is in the content div is dissapeared.
    Maybe I'm doing the whole floating thing wrong, sorry if I sound stupid.
    Is there another way to get the divs stand beside each other instead of under each other?
     
    xeongx, Jul 31, 2007 IP
  4. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #4
    Did you read the article thoroughly ? Are you containing floats? If it's fixed width and all of them add up to be the same width as the parent container, just float em left and clear left if you have a footer.
     
    soulscratch, Jul 31, 2007 IP