CSS圣杯布局
<body>
<div class="layout">
<div id="main">main</div>
<div id="aside-1">aside-1</div>
<div id="aside-2">aside-2</div>
</div>
</body>
.layout:after{
content: "";
display: block;
clear: both;
}
.layout{
padding-left: 150px;
padding-right: 200px;
margin: 0 auto;
}
#main{
width: 100%;
height: 500px;
background: #aaa;
float: left;
}
#aside-1{
width: 80px;
height: 200px;
background: #0aa;
float: left;
margin-left: -100%;
position: relative;
left: -80px;
}
#aside-2{
width: 100px;
height: 150px;
background: #aa0;
float: left;
margin-left: -100px;
position: relative;
left: 100px;
}