Thu, 2003-08-21 22:24
I'm having a very tough time creating a layout. It is 3 columns, and any of the 3 columns could be the longest. A container of all 3 columns should therefore s t r e t c h to hold all 3 columns. Heres an example of what I'm looking for, with 3 different possibilities:
1 = background
2 = container (on top of background)
3 = left column
4 = center column
5 = right column
Any of the three columns can be any size, and the container (2) will always contain all 3 columns, regardless of length.
I have no problem doing this if there was no container, but becuase the container has to be of variable length, I am having a tough time!
Logically, all three columns should be placed inside a container id, but when they are inside, they have to be relative, and I havent been able to make them stick to their sides! They always stack on the left or......
Any tips would greatly appreciated: if you'd like to see anything else, please ask.
Thanks very much!
Fri, 2003-08-22 01:38
#1
Going insane: 3 column layout with stretching container?
Hi Bungopolis,
Have you tried floating the three columns.
#lft{width:19%; float:left; border:solid 1px blue;}
#ctr{width:60%; float:left; border:solid 1px red;}
#rgh{width:19%; float:right; border:solid 1px green;} <div id="container"> <div id="lft">Left </div> <div id="ctr">Center</div> <div id="rgh">Right</div> <div style="clear:both;"></div> </div>
Hope that helps
Fri, 2003-08-22 07:52
#2
Going insane: 3 column layout with stretching container?
That's great, works perfectly! I did try using float before, but couldnt figure out how to get the center one in there. Thanks a lot.