Sto realizzando un sito internet in cui ci sono due colonne:
a destra ci sono i contenuti ed il footer,
a sinistra il logo, il menu ed una foto.

Inoltre la colonna di sinistra è di colore diverso rispetto a quella di destra.

Il mio problema nasce dal fatto che la foto dovrebbe posizionarsi sempre in fondo alla pagina qualsiasi sia la lunghezza del testo che si trova nel div a destra, però se la metto come immagine di sfondo l'altezza del div si ferma al menu e se la inserisco come img si posiziona subito sotto al menu.
I div sx e dx possono in qualche modo essere alti uguali?

Questo è il codice:
<div id="contenitore">
<div id="sx">
<div id="logo">
[img]../img/logo.jpg[/img]
</div>
<div id="menu">
<ul>[*]link1[*]link2[*]link3[*]link4[*]link5[/list]
</div>
<div id="img">
[img]../img/foto.jpg[/img]
</div>
</div>
<div id="dx">
<div id="testo">
</div>
<div id="footer">
</div>
</div>
<div class="clear"></div>
</div>

CSS:
#contenitore{
width:1000px;
margin: 0 auto;
background:#ffffff url(../img/bg.jpg) repeat-y top left; /*colore che si ripete nella colonna di sinistra*/
}
#sx{
float:left;
width: 300px;
background: url(../img/bgsx.png) no-repeat top left; /*sfondo dato alla colonna sx (immagine con trasparenza per far vedere anche l'immagine di sfondo del contenitore)*/

}
#dx{
float:left;
width: 700px;
}
.clear{
clear:both;
}

Grazie mille!!