Probleme avec height:auto ne marche pas

Bonjour a tous,

Mon probleme est le suivant je voudrais que les div de droite et de gauche se regle en fonction de la taille du div central, pour cela j'utilise

height:auto

mais rien a faire ca ne marche pas il garde la valeur de min-height est ceci dans firefox IE j'en parle meme pas.

Voici mon code:

#corps_de_page{ height: auto;}
                  
  #zone_menu_verticale { background: url(../images/images_site/menu.gif) repeat left bottom;
                         width: 150px;
                         min-height: 450px;
                         height: auto;
                         float:left;
                         color: white;
                         margin-bottom:auto;
                         border:solid black 1px;}
  
  #zone_de_contenu{ padding-left: 10px;
                    width:86%;
                    float:left;
                    height: auto;
                    min-height: 450px;}
  
  #bord_droite{ background: url(../images/images_site/entete.gif);
                width:5px;
                height: auto;
                min-height: 450px;
                float:right;}

D'avance merci

Bonjour,

Tu peux supprimer les height: auto; et min-height des colonnes latérales. Aucun code valable dans l'ensemble des navigateur ne permet d'aligner leur longueur sur une autre colonne.
Pour réaliser cet effet, on utilise une petite tromperie nommée "colonnes factices" : Comment faire des "colonnes" de même hauteur ?

(La FAQ donne des liens expliquant le fonctionnement technique de la chose, pour une explication en image, voir ma dernière réponse ici : http://forum.alsacreations.com/topic.php?fid=4&tid=14280&s=colonnes .)


Si tu tiens à garder une hauteur minimale pour la colonne centrale, au cas où elle manque de contenu, voici
comment procéder :

#zone_de_contenu{
     padding-left: 10px;
     width:86%;
     float:left;
     height: 450px; /* hauteur minimale pour IE - mais fixe pour FF*/
     min-height: 450px; /* hauteur minimale pour FF
     }

parent>#zone_de_contenu { /* méthode de sélection incompréhensible pour IE */
     height: auto; /* on rétablit la hauteur auto pour FF */
}

parent = tout div dans lequel se trouverait #zone_de_contenu, à défaut, on utilise BODY.
> figure une relation de parent à enfant, le second se trouvant donc contenu dans le premier.

#div_parent>#zone_de_contenu {}
[#gray][i]ou s'il n'y en a pas[/i][/#]
body>#zone_de_contenu {}

Modifié par (24 May 2006 - 09:12)

En fait ce que tu me dis si j'ai bien compris c'est de mettre un fond qui ferait evoluer mes colonnes de chaque coté

Mettre une image de fond qui simulerait une (ou plusieurs) colonne qui s'alignerait automatiquement sur celle du contenu.

Si on regarde la structure, les colonnes n'auront pas la même taille, mais le rendu visuel donnera pourtant cette impression.

autre chose tu me donnes ce bout de code mais les infos sont contraires les naviguateurs vont ils bien comprendre?

height: 450px; /* hauteur minimale pour IE - mais fixe pour FF*/
         min-height: 450px; /* hauteur minimale pour FF*/

Désolé si la question te semble débile mais je débute avec les css donc je m'interroge.