Click to See Complete Forum and Search --> : mixing widths with pixels and %


tehashman
07-10-2008, 07:33 PM
hey i have a two column layout and i want one column to be a fixed width and i want the other to expand the rest of the width.

just wondering if it will work if i float both elements.

eg:

.leftcol {
width:100px;
float:left;
}

.rightcol {
width:100%
float:left;
}

Centauri
07-10-2008, 08:56 PM
That won't work as the 100% width will be the width of the container and not the available width. The usual way is to float the fixed column and just specify a left margin on the unfloated variable width div :
.leftcol {
width:100px;
float:left;
}

.rightcol {
margin-left: 100px;
}
The .leftcol should come before the .rightcol in the html, and .rightcol should have no width or height dimensions (otherwise IE6 complains), and will fill the available width.