[Résolu] Css - Même hauteur pour 2 bloques

Bonsoir,
Sur mon site j'ai 2bloqué aligné. Leurs hauteurs est définis en pixel, 480 chaqu'un donc toujours la même hauteur, hors je voudrais la mettre en % (plusieurs raison, agrandissement de la police qui déborde plus, adapatation au différente résolution, ...)

Met si je met en %, alors le bloque 1 sera plus grand que le bloque 2 car le bloque 1 à plus de texte. En gros ça s'arrète pile à la fin du texte. J'ai essayé avec min-heugt, si je le met en pixel ça passe en % le même bug.

Si vous avez une idée pour m'aider =D

Css :

#left {
border:1px dashed #77fb77;
float:left;
padding-left:2px;
padding-right:2px;
width:58%;
height:480px;
margin-bottom:5px;
background-color: #e3ffe3;
background-image: url(../img/fond/fond_vert.gif);
}

#right {
border: 1px dashed #8ce8ff;background-color: #e6faff;
float:right;
margin-top:0px;
padding-left:2px;
padding-right:2px;
width:39%;
height:480px;
color:#FF0099;
background-color: #e6faff;
background-image: url(../img/fond/fond_bleu.gif);
}

Modifié par Bleeps (19 Jan 2006 - 23:32)

Je n'ai pas bien compris le problème...

Quand tu passes les hauteurs de tes blocs en pour cent, ils prennent la hauteur minimale (celle du contenu) ? Je suppose que ça veut dire que la hauteur que tu donnes n'est pas valide, car pas applicable, donc il fait comme si la propriété CSS que tu donnes n'était pas là.

Je vois peut-être une explication : tes deux blocs sont flottés (en left pour le premier, en right pour le deuxième). Du coup, ils sortent du flux de leur élément conteneur.
Et si la hauteur en pour cent se réfère à la hauteur du bloc conteneur, il faut sans doute que les éléments dont tu indiques la hauteur de cette manière ne sortent pas du flux de ce bloc conteneur.

Tiens, je vais faire un test pour voir.

Je comprend que tu n'es pas trop compris, mais alors la ton explication ma rendus + fou =P

Liens retiré !
Modifié par Bleeps (19 Jan 2006 - 23:32)

Salut,

J'ai plus simple : ton bloc conteneur n'a pas de hauteur définie : sa hauteur est donc celle de son contenu. Tes pourcentages se réfèrent donc à la hauteur de ton plus haut élément, dans le cas courant.

bonsoir,

au lieu des "%" tu mets des valeurs en "em" ce qui permettra au fenetre de s'allonger en fonction de ce que tu veux.

Attention tout de meme a un chose, si dans un de tes cadres il y a une image (comme c'est le cas) elle risque de sortir un peu si tu fais des zooms successif sur ton navigateur

fais le test et dis nous

Mon hypothèse n'est pas vérifiée : les blocs flottés peuvent quand même prendre une hauteur en pourcentage de la hauteur du bloc parent (si du moins elle est fixée !)... le problème ne vient donc pas du fait qu'ils sortent du flux du bloc parent (= le bloc conteneur).

Mais j'ai pu vérifier - je m'en doutais quand même - que lorsque le bloc conteneur n'a pas de hauteur fixée, indiquer une hauteur en pourcentage de cette non-hauteur ne sert à rien : les blocs enfants prennent la hauteur dont ils ont besoin pour leur contenu, et basta.
Modifié par mpop (19 Jan 2006 - 23:31)

J'ai mis ma hauteur en Em, et ça passe niquel.
Ca laisse la hauteur que je veux et s'agrandit si j'agrandis la police.

Merci beaucoup beaucoup pour votre aide =D