两列布局方案

一、float+margin

    <div id="content">
     <div id="aside">侧边栏固定宽度</div>
     <div id="main">主内容栏自适应宽度</div>

    </div>

#content{
width:100%;
height:100%;
overflow:hidden;
}
#main{
width:100;
float:left;
margin-left|right:210px;
}
#aside{
width:200px;
float:left|right;
}

优点：
可任意调换位置
父元素自适应高度
缺点：
不支持主内容优先显示
二、absolute+margin

<div id="content">
    <div id="main">主内容栏自适应宽度</div>
    <div id="aside">侧边栏固定宽度</div>
</div>
#content{
    position:relative;
}
#aside{
    width:200px;
    position:absolute;
    top:0;
    left|right:0;
}
#main{
    margin-left|right:210px; /*参考侧边固定宽度*/
}
优点：
可任意调换位置
可主内容优先显示
缺点：
侧边无法撑开父元素的高度，会溢出父元素区域。

三、float+-margin

<div id="content">
    <div id="main">主内容栏自适应宽度</div>
    <div id="aside">侧边栏固定宽度</div>
</div>
/*左定*/
#content{
    overflow:hidden;
    padding-left:210px; /*参考侧边固定宽度*/
}
#main{
width:100%;
    float:left;
}
#aside{
width:200px;
float:left;
position:relative;
    left:-210px;/*等于包含块内补白*/
margin-left:-100%;
}
/*右定*/
#content{
    overflow:hidden;
    padding-right:210px; /*参考侧边固定宽度*/
}
#aside{
width:200px;
float:left;
position:relative;
    right:-210px; /*等于包含块内补白*/
    margin-left:-200px;
}