CSS 100％的div高度

Question

我創建了一個搗鼓我的問題： http://jsfiddle.net/XJpGT/

綠框的高度應該是alyways是100％，而在同一時間的綠色和橙色盒子不應該比大藍色。我做了一個更好地瞭解一個屏幕：

http://img716.imageshack.us/img716/3736/b3oe.png

這可能嗎？內容是動態的，所有的框都可以有不同的高度。

我試圖用下面的代碼來完成，但你可以在小提琴中看到它不能像我想要的那樣工作。

.right1:after { 
clear: both; 
content: "."; 
display: block; 
height: 0; 
visibility: hidden;   
} 

Answer 1

我已經更新了你的提琴，看看這裏：http://jsfiddle.net/avrahamcool/XJpGT/1/

我的解決方案is'nt完美，因爲你將不得不劃分height綠格之間，和橙色DIV（和它們之間的margin）手動。 （在演示中，我給了80％的綠色，10％的橙色和5％的餘量） ，但它儘可能接近我能讓你達到你的目標。

UPDATE： 我已經更新了filddle，請看這裏：http://jsfiddle.net/avrahamcool/XJpGT/4/

現在你沒有指定和高度，訣竅是caled 人造列，你可以在所有閱讀它網絡。

您在.right2:before, .right2:after中指定了px中right2左右的餘量。