Welcome to WebmasterWorld Guest from 184.73.3.107

Forum Moderators: not2easy

Three column layout with mixed width types

Asking how CSS can be used to make a three column layout with mixed width t

   
9:45 am on Feb 29, 2004 (gmt 0)

10+ Year Member



I am trying to make a website three column layout with CSS. However I would like to use three different width types which seems to be complicating things.

I want the left hand column be specified by em, so that if the text size is changed by the user then the column will change to fit. The right hand column contains an image so it is at a fixed size. And I want the middle column takes up the remaining space.

The only way I have been able to acheive that is to have the left column floated left and the right column floated right. Both immediated before the main text which is not floated at all. However the problem with that layout is that when the text gets past the end of the side column it takes up the full width of the screen.

7:12 pm on Feb 29, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Yep you are on the right track.

Just add a left and a right margin to the center column that is big enough for the side columns.

4:28 pm on Mar 4, 2004 (gmt 0)

WebmasterWorld Administrator ergophobe is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



Or a left and right border with background-color set if you want the columns colored all the way down regardless of how far down the side-matter goes. In other words if you want page-length columns rather than boxes, you set the background on both the floated boxes and the borders and so the colored cols always go down as far as the end of the longest element.

Tom

6:32 pm on Mar 4, 2004 (gmt 0)
 

Featured Threads

Hot Threads This Week

Hot Threads This Month