Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Nov 2007
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Equal Column Heights

    I've been searching for ways to keep my columns equal heights as content fills in one... the other one will expand to the same height even though it may not have as much content as the other... I've read other posts.. but I wanted to know the differences.. see below.. hence why im starting a new thread..

    I've noticed that there are three main ways to do this.. straight CSS, Java, and the repeat-y image method.

    So here is my question. What is the cleanest and most effective code? Likes Dislikes? Browser advantages / disadvantages... ?
    Last edited by Papa; 12-13-2007 at 05:01 AM.

  • #2
    Regular Coder
    Join Date
    Nov 2006
    Posts
    246
    Thanks
    13
    Thanked 26 Times in 24 Posts
    It's not possible. I guess you've figured that out. The easiest way is the CSS repeat-y. I don't know the JavaScript way, but the CSS way is really easy.

    CSS:
    Code:
    #wrapper { 
        background: url('leftcol_bg.gif') repeat-y; 
    }
    HTML:
    Code:
    <div id="wrapper">
        <div id="leftcol"></div>
        <div id="rightcol"></div>
    </div>

  • #3
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #4
    New Coder
    Join Date
    Nov 2007
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thanks for the links Frank. I've been to those sites several times. I'm concerned with their equal height methods for my design style.. (see image below) I used two div boxes, one inside the other, to give it that cool border with different color on the inside.. ... for some reason IE is being stupid, per usual, and deciding it wants to adjust the spacing between the columns.. for some odd reason... i dunno why... so i figured a background image might not be the way to go... i've included the same content in both columns.. just for typesetting purposes..

    Last edited by Papa; 12-13-2007 at 03:44 PM.

  • #5
    New Coder
    Join Date
    Nov 2007
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Bumppppppppppppppppp

  • #6
    New Coder
    Join Date
    Nov 2007
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts
    even with the layout for "what we do" and "recent news" columns.. would you all suggest that I still use the repeat image variable to get equal length columns?

  • #7
    New Coder
    Join Date
    Nov 2007
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i guess no one knows


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •