Hauteur d'un bloc en float left

Bonjour,

J'ai un soucis de CSS. J'ai un bloc principal (conteneur) qui regroupe deux blocs (sidebar et contenu).

Sidebar est en float: left; et mon problème porte sur sa hauteur. En effet, il y a un background sur sidebar et si le bloc contenu est plus long, la hauteur du bloc sidebar ne suit pas.

Pouvez vous m'aider ?

Le HTML:

<div id="conteneur">
            <div id="bandeau">
            </div>
            <div id="sidebar">
                <div id="recherche">{search}</div>
                <div id="menu">{menu}</div>
            </div>
            <div id="contenu">{content}</div>
            <div id="footer"></div>
        </div>

Le CSS:

div#conteneur{
    background-color: #FFFFFF;
    overflow : hidden;
}

div#sidebar{
    background: url(uploads/images/gabarit/fond_sidebar.png) repeat-y;
    width: 267px;
    float: left;
    height: 100%;
}

div#contenu{
    margin-left: 267px;
}