help with css/html setup of left side menu nt reaching the bottom

[Jnerocorp]

On my page the left menu does not expand in height to the width of the main content if anyone can figure out how to do this it would be greatly appreciated i just cant figure it out.

 

html:

<div id="menu">
<div id="border"></div>
<ul>
<a href="#"><li><img src="http://i.min.us/incgQI.png"><h1>New Messages</h1></li></a>
<a href="#"><li class="active"><img src="http://i.min.us/imXKmu.png"><h2>My Inbox</h2></li></a>
<a href="#"><li><img src="http://i.min.us/inciYQ.png"><h1>Archived Messages</h1></li></a>
<a href="#"><li><img src="http://i.min.us/inciYQ.png"><h1>Place Holder</h1></li></a>
</ul>
</div>

 

css:

#menu {
    background: none repeat scroll 0 0 #F1F1F1;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-top: -51px;
    min-height: 500px;
    position: absolute;
    width: 240px;
    z-index: 2;
}

 

Link to page: http://1two.co/msg

[cssfreakie]

the link to your page is broken