100％高度減去可變高度

Question

我堅持着一個問題：我有basicly 4周的div：

<div id="a">Variable Height: 45px or 90px</div> 
<div id="b">fixed height: 50px</div> 
<div id="c">Has to fill up remaining</div> 
<div id="d">Variable Height: 85px or 40px</div> 

另外：#C可能不是下方，上方#d的。它必須填滿，直到＃頂部。可以使用填充符，#c的內部可能不會在#d之下/之下/之下。

而這裏的CSS：

* { margin:0px; padding:0px; } 
body, html { height:100%; } 
#a { min-height: 45px; width:100%; background: red; max-height:90px; } 
#b { height: 50px; width: 100%; background: orange; float:left;} 
#c {/*Here how to fill up remaining*/ } 
#d { min-height: 40px; max-height: 85px; background: green; float:left; position:absolute; bottom:0px; } 

我不能使用JavaScript，不幸的是，所以我希望有一些可能與CSS！

編輯：

我試圖-webkit-計算的，但沒有奏效，因爲該值必須是靜態的。

使用Safari 7.0.2 乾杯， 的Douwe

編輯 有一張桌子就解決了問題..需要更多一點外的開箱比我想象！反正謝謝！

Answer 1

將c的高度設置爲自動或100％適用於Chrome。什麼不適合你？

DEMO如果更改兩個變量高度div的內容，c的高度會正確更改。

CSS：

* { margin:0px; padding:0px; } 
body, html { height:100%; } 
#a { min-height: 45px; width:100%; background: red; max-height:90px; overflow:hidden; } 
#b { height: 50px; width: 100%; background: orange; float:left;} 
#c { height: 100%;} 
#d { min-height: 40px; max-height: 85px; background: green; float:left; position:absolute; bottom:0px; width: 100%; }