/* 基本上完美解决你的问题， 基本上可以拿来就用，控制center 和bottom的位置只需要修改margin-top 的值就可以解决了，而left 和right的值你愿意的话也可以修改为固定值我这里用的百分比， center的宽度按要求80%的百分比。*/
....................................................................................................................................
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
body { margin: 0; padding: 0; }
#top { background: gray; height: 300px; margin: 0; }
#center {margin:-915px 10%; padding: 10px; width: 80%; height: 500px; background: #00f; position: relative; top: 300px; }
#left {width: 15%; height: 500px; background: red; z-index: 5; display: inline-block;}
#right {width: 15%; height: 500px; background: green; z-index: 6; display: inline-block; position: relative; top: 0; right: 0; float: right; }
#bottom { margin: 30;background: gray;height: 500px; position: relative; top:300px; }
</style>
</head>
<body>
<div id="top"></div>
<div id="bottom"></div>
<div id="center">
<div id="left"></div>
<div id="right"></div>
</div>
</body>
</html>
..............................................................................................
....................................................................................................................................
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
body { margin: 0; padding: 0; }
#top { background: gray; height: 300px; margin: 0; }
#center {margin:-915px 10%; padding: 10px; width: 80%; height: 500px; background: #00f; position: relative; top: 300px; }
#left {width: 15%; height: 500px; background: red; z-index: 5; display: inline-block;}
#right {width: 15%; height: 500px; background: green; z-index: 6; display: inline-block; position: relative; top: 0; right: 0; float: right; }
#bottom { margin: 30;background: gray;height: 500px; position: relative; top:300px; }
</style>
</head>
<body>
<div id="top"></div>
<div id="bottom"></div>
<div id="center">
<div id="left"></div>
<div id="right"></div>
</div>
</body>
</html>
..............................................................................................
