<div class="header">Header</div> <div class="bd"> <div class="main"> <div class="inner"> Main </div> </div> <div class="left">Left</div> <div class="right">Right </div> </div> <div class="footer">Footer</div>
body{padding:0;margin:0}
.header,.footer{width:100%;background:#666;height:30px;clear:both;}
.left{background:#E79F6D;width:150px;float:left;margin-left:-100%;}
.main{background:#D6D6D6;width:100%;float:left;}
.right{background:#77BBDD;width:190px;float:left;margin-left:-190px;}
.inner{margin-left:150px;margin-right:190px;}
增加多一个div就可以不用相对布局了,只用到了浮动和负边距,这就是双飞翼布局。
DOM结构:main内层增加了一个div
原文:http://www.cnblogs.com/coldfishdt/p/6216046.html