-
imbrication de div
j'ai encore un autre problème :
je veux afficher deux éléments dans un div conteneur de hauteur fixe :
- un <p> de hauteur variable selon le texte ou le nav client
- un autre <div class=contenu> qui contient lui même un <table> de hauteur variable aussi
la somme des hauteurs <p>+"contenu" doit toujours être égale à la hauteur de "conteneur"
donc jamais de scrollbar sur "conteneur" sachant pour récapituler que :
1) la hauteur de "conteneur" est fixe
2) <p> est toujours très inférieur à "conteneur"
3) "contenu" doit occuper tout l'espace laissé par <p> mais rien que lui, en affichant une scrollbar si son propre contenu devait trop grand
j'ai fait ça :
class conteneur {width: 300; height: 400;}
class contenu {height: 100%; width: 100%; overflow: auto;}
<div class="conteneur">
<p> texte taille variable</p>
<div class="contenu"> <table> ..</table></div>
</div>
sous IE en tous cas ça ne marche pas, le div conteneur prend la hauteur de la table
le seul moyen que j'ai trouvé est de mettre "contenu" avec une hauteur fixe et un overflow auto, mais alors la hauteur du conteneur dépend de celle de <p> ...
et ce coup ci un <table> comme conteneur ne marche pas, car en fait j'ai 2 conteneurs cote à cote et leurs <p> et <table> respectifs n'ont pas la même hauteur donc chaque ligne est de hauteur différente
merci de votre aide, en espérant n'avoir pas été trop confus
-
le problème vient du fait que ton contenu a une hauteur de 100%. sous ie (je ne sais pas si c'est tous les navigateurs), 100% représente la totalité de la fenêtre du navigateur. donc tu n'auras jamais de barre de défilement dans ce div. essaie pour voir de le mettre à 20% et tu verras que cela fonctionne correctement.
c'est peut-être très difficile, mais à mon avis, la seule solution que tu aies, c'est d'estimer la hauteur de ton <p> (avec php par exemple si cela fait partie d'une base de données) ou d'y mettre une hauteur fixe suffisante pour gérer le plus grand texte dans <p>, et d'affecter la hauteur restante dans ton contenu (soit en %, soit en pixels)
je mettrais également overflow:none dans ton conteneur, même si ce n'est pas forcément indispensable
-
>le problème vient du fait que ton contenu a une hauteur de 100%
OK, dans ce cas effectivement ça devient compliqué, une hauteur fixe à mon <p> sera d'un meilleur rapport complxité/rendu je crois
ce qui est bizarre est qu'en largeur le 100% marche, la couleur de fond ne déborde pas à droite
en tous cas merci de ta réponse