View Full Version : Css Fluid and Fixed layout

07-01-2011, 07:07 AM

I want to make two column layout. Can we make css layout with two column with fixed and fluid layout ?

#main {width: 100%; clear: both;}

#colum-left {
float : left;
width: 15%;
padding : 2px;
margin : 0;

#colum-right {
float : right;
width: 83%;
padding : 0px;
margin : 0;
background : #ffffff;

The problem is when i view in 650px it got too narrow at left side ?

07-01-2011, 10:22 AM
I'm not sure what you mean? If you mean you want to set your left column to a fixed size you can do:

width:100px; //will set to 100 always


min-width:100px; //will never be smaller than 100px but will stretch to 15% when able

Then just take away the width on your column-right, then it will fill the rest of the gap. But for that to happen you first need to set column-right to float:left; Don't float in different directions like that for layouts (some things like headers etc where widths are static is ok). Not only is it yucky but it messes stuff up, especially on mobile devices.

07-01-2011, 10:23 AM
Have a look at http://bonrouge.com/2c-hf-fullyfluid.php