i have the following script

<div id="content">
        <div id="left">
            <div id="menu">
                <ul>
                    <li>menu</li>
                </ul>
            </div>
            <div id="left_ad">
            </div>
        </div>
        <div id="middle">
            some text here...
        </div>
        <div id="right">
            <div id="right_ad">
                <div id="ad2">
                </div>
            </div>
        </div>
    </div>

css:

#content
{

    margin: 0;
    padding: 0;
    overflow: hidden;
    position: relative;

}
#left
{
    float: left;
    width:25%;
    margin-left:0;
    margin-right:0;
    margin-top:0;
    margin-bottom:-5000px;
    padding-left:0;
    padding-right:0;
    padding-top:0;
    padding-bottom:5000px;

}
#middle
{
    background-image:url("http://localhost/kino/img/theme.png");
    background-repeat:no-repeat;
    float: left;
    width:50%;
    margin-left:0;
    margin-right:0;
    margin-top:0;
    margin-bottom:-5000px;
    padding-left:0;
    padding-right:0;
    padding-top:0;
    padding-bottom:5000px;
}
#right
{
    float: left;
    width:25%;
    margin-left:0;
    margin-right:-1px;
    margin-top:0;
    margin-bottom:-5000px;
    padding-left:0;
    padding-right:0;
    padding-top:0;
    padding-bottom:5000px;
}
#left_ad
{
    background-image:url("http://localhost/kino/img/lens1.png");
    background-repeat:no-repeat;
    min-height:498px;
    margin-left: auto;
    margin-right: auto;
    margin-top:31px;
    padding:0;
    width: 188px;
    position: relative;
    height: 100%;
}

as you see, left, middle and right are have the same size of heigth, which is equal to max of them. and now, what is the question, i want left_ad to have the same heigth too. how can i set the heigth of left_id is equal to left? thanks