Largeur extensible avec div en float et IE7

Bonjour,

Est-ce possible d'avoir deux div, l'une à côté de l'autre et qui soit extensible en largeur suivant le contenu, je m'explique:

<div id="site">
    <div id="left">
        <ul id="menu">...</ul>

        <ul id="submenu">...</ul>
    </div>

    <div id="content">
        <p>Mon contenu</p>
    </div>
</div>

#site {
    width: 960px;
    margin: auto;
}

#menu, #submenu {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100px;
}

#menu {
    float: left;
}

#submenu {
    float: right;
}

#content {
    overflow: hidden;
    padding-left: 10px;
}

Avec ce code j'obtiens mes 3 div une à côté de l'autre, si je fais:

#submenu {
    display: none;
}

Mon sous-menu disparait et la div content prend toute la largeur disponible, c'est ce que j'aimerais faire, mais le problème c'est que quand j'ai mes 3 div affiché, IE7 met ma div #content dessous les deux autres...comment régler ce problème?

Merci d'avance