Højde på div

Hej

Har lige brug for lidt hjælp.

jeg har en hjemmeside med en MENU i venstre side, og så ellers INDHOLD til højre, og i bunden har jeg så en FOD.

Da min MENU i venstre side har en anden baggrundsfarve end INDHOLD, vil jeg gerne af de er lige høje.

Men kan ikke bare sætte height: 100% for min MENU, da jeg så både skal gøre det for SIDE, BODY og HTML. Hvilket resulter i at min MENU bliver 100% af siden og ikke sammen højde som INDHOLD.

Hvad gør man så?

html:
<div class="SIDE">
<div class="MENU"></div>
<div class="INDHOLD"></div>
<div class="FOD"></div>
</div>

css:
div.SIDE
    {
    position: relative;
    margin: 0 auto;
    width: 806px;
    border-bottom: 1px solid #000000;
    border-left : 1px solid #000000;
    border-right : 1px solid #000000;
    border-top : 0px solid #000000;
    background-color : #ffffff;
    padding: 0px;
    }

div.MENU
    {
    vertical-align: top;
    float: left;
    height: 100%;
    width:200px;
    border-bottom: 0px solid #000000;
    border-left: 0px solid #000000;
    border-top: 0px solid #000000;
    border-right: 0px solid #000000;
    padding: 3px;
    background-color : #000000;
    }

div.INDHOLD
    {
    vertical-align: top;
    margin-left: 200px;
    width: 600px;
    border-bottom: 0px solid #000000;
    border-left : 0px solid #000000;
    border-right : 0px solid #000000;
    border-top : 0px solid #000000;
    padding: 0px;
    height: 100%
    }

div.FOD
    {
    width: 806px;
    height: 16px;
    border-bottom: 0px;
    border-left: 0px;
    border-top: 0px;
    border-right: 0px;
    padding: 0px;
    background-color : #000000;
}