Div within a div – stretch vertically

I have a div within a div that I want to stretch vertically, it works if I specify the pixes but I need a generic solution. The page is a content page for an asp.net master page. Ignore mastersidenav – this is a flyout menu.

[CODE] <div>
<div id=”mastersidenav” class=”sidenav”>
<a href=”javascript:void(0)” class=”closebtn” onclick=”closeNav()”>&times;</a>

<div id=”accordion”>
<h3 class=”accordionheader”>HOME</h3>
<div>
<asp:ImageButton runat=”server” ImageUrl=”/Images/dashboard_menu.png” />
</div>
<h3 class=”accordionheader”>ASSETS</h3>
<div>
<p>———-</p>
</div>
<h3 class=”accordionheader”>REPORTS</h3>
<div>
<p>———-</p>
</div>
<h3 class=”accordionheader”>SETTINGS</h3>
<div>
<p>———-</p>
</div>
</div>
</div>
<div class=”test”>
<span onclick=”openNav()” class=”menuicon” onmouseover=”this.style.cursor=’pointer'”></span>
</div>
</div>[/CODE]

Here is the CSS

[CODE].test {
width: 200px;
height: 100%;
background: #085394;

}

.menuicon {
background: url(../images/menu_icon.png) no-repeat;
width: 75px;
height: 75px;
position: absolute;
top: 110px;
left: 15px;
display: block;
}

[/CODE]

Also in #CSS _↴