<html>
<body>
<div class="main">
<div class="top">top</div>
<div class="left">left</div>
<div class="center">center</div>
<div class="right">right</div>
<div class="footer">bottom</div>
</main>
</body>
<style type="text/css">
html,body{
padding: 0;
margin: 0;
}
.top {
position: absolute;
top: 0;
width: 100%;
height: 10%;
background: #333;
}
.left {
position: absolute;
top: 10%;
left: 0;
width: 15%;
height: 80%;
background: #aaa;
}
.center {
position: absolute;
top: 10%;
left: 15%;
width: 75%;
height: 80%;
background: #a0a;
}
.right {
position: absolute;
top: 10%;
right: 0;
width: 20%;
height: 80%;
background: #ff0;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
height: 10%;
background: #0ff;
}
</style>
</html>
