Imbrication de DIV contenant un tableau

[jer2701]

Bonjour,

J'ai un problème avec une mise en page structurée de la manière suivante :

je dispose d'une DIV principale

Code: Tout sélectionner

#page
{
   float:left;
   height:100%;
   width:100%;
}


Cette DIV comporte 2 DIV enfants qui coupent cette page principale en deux :

Code: Tout sélectionner

#colonne_gauche
{
   float:left;
   margin:1%;
   width:24%;
}

#colonne_droite
{
   float:left;
   width:73%;
}


ma DIV #colonne_droite comporte un tableau relativement long.

Mon problème est que ma DIV #colonne_droite et son tableau descendent plus bas que ma DIV #page (en passant par dessus).
j'ai beau retourner le problème dans tous les sens je ne vois pas comment faire pour que ma DIV #page s'étende en hauteur en fonction de la longueur du tableau qui varie dynamiquement...

[spout]

Sans exemple à voir c'est pas facile.
A première vue je dirais que tu dois mettre un div clear:both après le div#page

[jer2701]

Je viens effectivement de trouver cette propriété qui malheureusement ne change rien au problème ...
la propriété clear:both; pousse ma DIV #colonne_droite sous ma DIV #colonne gauche sans agrandir ma DIV #page

[spout]

Comme je te disais, sans exemple (URL) c'est presque impossible de t'aider, on ne peut deviner le code HTML.

[Rod la Kox]

Mettre un overflow sur la div de gauche ?

[Zecat]

Deja c'est sous quoi IE / FF ou chrome ? Parce que perso j'ai souvent des comportements radicalements différents avec les div entre IE/FF d'un coté et chrome qui souvent part en vrille ...

[blman]

Code: Tout sélectionner

<div id="page">

<div id="colonne_gauche"></div>
<div id="colonne_droite"></div>
<br clear="all"/>

</div>

OU

Code: Tout sélectionner

<div id="page">

<div id="colonne_gauche"></div>
<div id="colonne_droite"></div>
<div style="clear:both;"></div>

</div>

[anemone-clown]

Tente de changer le 100% en auto :

Code: Tout sélectionner

#page{
   float:left;
   height:auto;
   width:100%;
}


Et si ça ne va plus pour ta mise en page, ajoute

Code: Tout sélectionner

  min-height:100%;


En revanche, IE6 (voir 7) sera dans les choux...

[jer2701]

merci à tous, vous êtes très efficace

c'est anemone-clown qui a trouvé la solution
ma DIV #page avec son height:100% devait être en auto tout simplement.
Quel casse-tête pour si peu !
bravo et merci