Results 1 to 3 of 3

Thread: Stretching all columns to length of longest column

Hybrid View

  1. #1
    Join Date
    Dec 2002

    Stretching all columns to length of longest column

    OK - my CSS skills are creeping slowly forward. Now what I've run into is that I need to lengthen a couple of columns that have very little content in them to be the same as a column that has more content in it. In my example page:
    the central column is the longest. In some cases on this site that won't be the case - sometimes the central content will be quite short and the left or right column will determine the page length. The green bar at the bottom of course should snug up against all three columns.

    I do have all three in a single div - it contains two divs: one for the left column and one for the center/right column, the latter of which contains further divs to create the center and right columns. So if I can just stretch all these divs to the bottom of the enclosing div I should be OK.

    What's a good approach to this? I've seen tips about getting columns to stretch the height of the page, but not something like this.

    On another matter, notice how the Search box up top is sitting a bit low. Seems to have a margin above it (and below if I set the div height to auto) - though the style for that form field has margins (and padding) of zero. Also tried setting the padding for the div it's inside to zero. Is there something else I should change to get this form field to move up?

    - Bob
    Last edited by bunner bob; 07-07-2005 at 01:02 AM.

  2. #2
    Join Date
    Apr 2005
    Bathurst, NSW, Australia

  3. #3
    Join Date
    Dec 2002
    Ah - that Stu Nichols one did the trick - thanks!

    The List Apart one would probably be great if my columns extended all the way to the bottom of the page - but they don't.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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