使子Div扩展到浏览器大小

Question

我想知道如何用位置创建一个div：当它是一个div的子节点时，绝对延伸到浏览器的底部：position：relative。这是html：

<div id='square'>
<div id='rectangle' /></div>

这是css：

#square {
position:relative;
height:100px;
width:100px;
background:red;
}
#rectangle {
position:absolute;
width:50px;
background:blue;
height:100%;
}

http://jsfiddle.net/mHpuW/

Answer 1

http://jsfiddle.net/mHpuW/1/

html,body{height:100%;}
#square {
    position:relative;
    height:100%;
    width:100px;
    background:red;
}
#rectangle {
    position:absolute;
    width:50px;
    background:blue;
    height:100%;
}