3栏自适应布局的2种方法
最近经常碰到这个, 所以在博客上作个笔记:
1. position方法
<div id="left"></div>
<div id="center"></div>
<div id="right"></div>html, body, #left, #center, #right{height:100%;}
#left, #right{width:200px; position:absolute;}
#left{top:0; left:0; background-color:red;}
#right{top:0; right:0; background-color:black;}
#center{margin: 0 205px 0 205px; background-color:blue;}
2. float方法
<div id="left"></div>
<div id="right"></div>
<div id="center"></div>html, body, #left, #center, #right{height:100%;}
#left, #right{width:200px;}
#left{float:left; background-color:red;}
#right{float:right; background-color:black;}
#center{margin: 0 205px 0 205px; background-color:blue;}