一栏定宽、一栏自适应

布局技巧

1. 两列左边定宽，右边自适应

<div class='side'>
      <div class='miancontent'>
</div>
<div class='main'>
      <div class='miancontent'>
</div>

.side{
     width:200px;
     flolat:left;
     position:relative;
     margin-right:-200px;
}
.main{
     float：right;
     width:100%;
}
.miancontent{
      margin-left:210px;
}

2. 两列右边定宽，左边自适应

<div class='main'>
      <div class='miancontent'>
</div>
<div class='side'>
      <div class='miancontent'>
</div>

.side{
     width:200px;
     flolat:right;
     position:relative;
     margin-left:-200px;
}
.main{
     float：left;
     width:100%;
}
.miancontent{
      margin-right:210px;
}

3. 三列中间自适应布局

<div class="sideLeft">
      <p>左侧定宽</p>
</div>
<div class="main">
    <div class="miancontent"></div>
</div>
<div class="sideRight">
      <p>右侧定宽</p>
</div>

.sideLeft{float:left;width:200px;position:relative;margin-right:-200px}
.main{float:left:width:100%;}
.miancontent{margin:0 240px 0 210px;}
.sideRight{float:right;width:230px;position:relative;margin-left:-230px}