Hauteur d'un bloc en float left

Résolu
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;
}


--
Fier d'être Normand!
95% of bugs are between keyboard & chair

2 réponses

  1. tout çà me paraît normal, je pense, sauf si tu veux avoir la même hauteur pour les deux blocs.
    1. En effet c'est ça, je veux la même hauteur sur les deux blocs.

      Je viens de trouver une solution :
      div#conteneur{
          background: url(uploads/images/gabarit/fond_sidebar.png) repeat-y;
          overflow : hidden;
      }

      En mettant mon background sur le conteneur ça marche :)