[Résolu] Remplacer overflow: auto;

Bonjour,

J'ai un petit problème sur cette page: http://bricosign.free.fr/Xekyo/index.php?titre=Toutes_les_pages&type=page Si la liste de gauche est plus haute que celle de droite, la liste de gauche (qui est flottante) va s'encastrer dans le cadre Administration qui est en dessous (qui est aussi flottant).

Comme solution j'ai utiliser un overflow: auto; sur un bloc qui contient les deux blocs qui contiennent les deux listes.

Malheureusement (ça ne peut jamais marcher avec moi) sous firefox, quand on clique sur le lien Toutes les pages (au bas de la liste de droite), on voit apparaître des barres de scrolls autour du conteneur.
Et si j'enlève l'overflox: auto, quand la liste de gauche est plus haute que celle de droite, le contenu de la liste de gauche rentre dans la barre administration qui est dessous.

Voici le code XHTML concerné:

<div id="liste_conteneur">
 <div id="liste_gauche">
  <h3>A</h3>
  <ul>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Ajouter_une_page&amp;type=page">Ajouter une page</a></li>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Ajouter_une_page2&amp;type=page">Ajouter une page2</a></li>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Ajouter_une_page3&amp;type=page">Ajouter une page3</a></li>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Ajouter_une_page4&amp;type=page">Ajouter une page4</a></li>
  </ul>
 </div>
 <div id="liste_droite">
  <h3>M</h3>
  <ul>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Modifier_une_page&amp;type=page">Modifier une page</a></li>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Modifier_une_page:_confirmation&amp;type=page">Modifier une page: confirmation</a></li>
  </ul>
  <h3>T</h3>
  <ul>
   <li><a href="http://bricosign.free.fr/Xekyo/index.php?titre=Toutes_les_pages&amp;type=page">Toutes les pages</a></li>
  </ul>
 </div>
</div>

Et le code CSS ( http://bricosign.free.fr/Xekyo/css/styles.css ):

#contenu li {
	text-align: justify;
	color: #333332;
        font-size: 1em;
        line-height: 1.4em;
        list-style-type: none;
        background-image: url("../images/puce.gif");
        background-repeat: no-repeat;
        background-position: 0% 55%;
        padding-left: 5px;
}
#liste_conteneur {
        overflow: auto;
        margin-bottom: 10px;
        width: 597px;
        margin-right: 7px;
}
#liste_gauche {
        float: left;
        width: 290px;
}
#liste_droite {
        margin-left: 301px;
        width: 290px;
}

Merci pour votre aide.

Bonne journée,

Rémi
Modifié par *|~ XiKuXan ~|* (03 May 2006 - 17:19)