首页 > 代码库 > 宽度自适应布局

宽度自适应布局

solution1、

宽度自适应的元素放在上面。

<div id="box">

  <p id="right">右侧</p>

</div>

固定宽度元素放在下面

<div id="left">左侧</div>

<style>

  #box{float:left;width:100%;height:400px;}

    #right{margin-left:200px;}

  #left{float:left;width:190px;margin-left:-100%;height:400px}

</style>

------------------------------------------------------------------------------------------------------------------------------------------

solution2

<div id="left">左侧</div>

<div id="box">

  <p id="right">右侧</p>

</div>

 

<style>

  #left{float:left;position:relative;width:190px;height:400px;margin-right:-190px;}

  #box{float:right;width:100%}

    #right{margin-left:200px;}

</style>

 

宽度自适应布局