兩個問題：right無法自適應和left沒有浮動沒有定位也在左邊，代碼和效果圖如下.求解？
我的想法是這樣的，top和foot沒有設置寬度，所以寬度直接自適應。
main作為包裹left與right也是直接自適應
問題就在中間：left通過浮動到左邊，實際上把浮動去掉也在左邊為什么？
? ? ? ? ? ? ? ? ? ? ? ? right雖然通過絕對定位與left有了間距，但是無法自適應寬度，了解是內容限制，怎么辦求解？
代碼與效果如下。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"?
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>混合布局編程挑戰</title>
<style type="text/css">
body{ margin:0; padding:0; font-size:30px; color:#fff}
.top{height:200px;background:yellow;}
.main{height:300px;background:red;}
.right{height:300px;background:green;position:absolute;left:210px;}
.left{width:200px;height:300px;background:blue;float：left；}
.foot{height:100px;background:#ccc;clear:both;}
</style>
</head>
<body>
<div class="top">top</div>
<div class="main">
? ? <div class="right">right</div>
? ? <div class="left">left</div>
</div>
<div class="foot">foot</div>
</body>
</html>
2017-02-23
right你設置了距離左邊距left:210px,你沒有設置右邊距呀少年。你加上：right：0；就可以了
2017-02-22
.top{background:#ccc;height:100px;}
.main{height:600px;background:red;}
.left{width:200px; height:600px;background:blue;}
.right{height:600px;background:yellow;left:210px;width:100%;position:absolute;}
.foot{background:orange;height:50px;}
通過刪減測試，真正有用的就right內幾個，其他的屬性就基礎定義屬性就能實現了，
2017-02-22
.top{background:#ccc;height:100px;}
.main{height:600px;background:red;position:relative;}
.left{width:200px; height:600px;background:blue;float:left;position:absolute;}
.right{height:600px;background:yellow;margin-left:210px;width:100%;position:absolute;}
.foot{background:orange;height:50px;}
在設置position:absolute;屬性之后right從塊級元素隱性改變為內聯塊狀元素，所以width的默認值從滿屏變為包裹內容，故要重新設置width的屬性100%
2017-02-16
給right設置一個寬度，或者采用設置right的左外邊距的px值來控制right的寬度