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%; }