html高度自适应

不借助javascript,不使用绝对定位,不用overflow:hidden将溢出部分隐藏,如何使div的高度自适应?
不需要考虑低版本浏览器。

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style type="text/css">
        html,body         {width: 100%;height: 100%;}
        </style>
    </head>
    <body>
        <div style="height:100px">top</div>
        <div>middle</div>
        <div style="height:100px">bottom</div>
    </body>
    </html>

比如上面的middle,如何让它的高度铺满屏幕剩余的空间?

查看回复