Hauteur d'1 div container contenant une div float:left, débutant

Bonjour a tous

J'ai un souci de positionnement.
Pour faire simple,
Une div .container inclut deux div , .content_gauche (float:left;) et .content_droite (float:right;)

J'aimerais que la hauteur de mon .container s'adapte à la hauteur occuppée par les deux div qu'il contient. Donc ne pas lui assigner de hauteur fixe.

J'ai mis en place des div avec clear:both; en style placées avant la fin de mes div container, ça a marché pour la plupart des navigateurs sauf IE7.

Qqun a une idée sur comment faire ? Le site étant en développement et pas fini, je peux donner l'URL de la page test :
-http://www.nickargall.com/v2/template.php

Merci à l'âme charitabel qui pourra m'aider

Edit : Un backlink gratuit en home de mon site à celui qui me trouvera la solution quand la nouvelle version du site sortira, et sur la home de mon site moche actuel
Modifié par Nickargall (13 Dec 2006 - 12:39)

L'overflow auto va me mettre des ascensceurs, non ? Argh ...
quant à la solution que tu me proposes en lien, déjà j'ai pas tout compris, et la technique des div avec clearest déja testée mais sans succès sur IE 7 (ça marche sur tout le reste) Argh..

Come je l'indique, je suis un débutant, c'est la première fois que je dis adieu aux tableaux

Nickargall a écrit :
L'overflow auto va me mettre des ascensceurs, non ? Argh ...

Ben essaye, tu verras bien... que non

Nickargall a écrit :
quant à la solution que tu me proposes en lien, déjà j'ai pas tout compris

C'est pas bien compliqué pourtant. Il te suffit de donner à ton div container une classe nommée ici "clearfix" et de rajouter dans ta feuille de style le code suivant:

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

edit: je vois que "conteneur" est une classe appliquée à ton div hors, il n'y a aucune raison (de moins, je ne la vois pas!) pour que ce soit une classe et non un identifiant. Je te conseillerais donc d'assigner "conteneur" en tant qu'identifiant et d'avoir donc quelque chose comme ceci dans ton code xhtml:

<div id="conteneur" class="clearfix"> ... </div>

Si, pour une raison que j'ignore, tu désires garder "conteneur" en tant que classe, tu peux ajouter une deuxième classe (clearfix) à ton div de cette manière:

<div class="conteneur clearfix"> ... </div>

Modifié par Benjamin D.C. (13 Dec 2006 - 13:14)

Ouarf désolé ça aurait du marcher des le début .. quel ane ... j'avais une hauteur fixe à 200px pour mon container donc évidemment que non qu'il va pas s'adapter à la hauteur du contenu ... ouarf quel ane je suis ...
Sinon, la solution que j'ai mise en place est de placer avant chaque fermeture de div conteneur une <div class="clear"></div> avec dans la feuille css :

.clear
{
clear:both;
}

et ça marche bien pour peu qu'on fasse pas d'ânerie ailleurs.

merci néanmoins pour ta réponse, mais tu n'as pas gagné le backlink, désolé

EDIT : Pour la classe .conteneur, j'y colle une image d'arrière plan répétée sur la longueur, d'ou le pourquoi du choix de la classe. Et aussi passque pour l'instant je débute en CSS
Modifié par Nickargall (13 Dec 2006 - 13:20)

It's all yours...

Salut,

Nickargall a écrit :

Sinon, la solution que j'ai mise en place est de placer avant chaque fermeture de div conteneur une <div class="clear"></div> avec dans la feuille css :

.clear
{
clear:both;
}

ba tu avais une chance sur deux...

Et t'as perdu !

c'est bien l'autre solution qu'il fallait employer. Ou plutôt la solution générale des contextes de formatage.

un peu de lecture :
http://www.blog-and-blues.org/articles/Float%2C_clear_et_contextes_de_formatage

clb56 a écrit :
Salut,

ba tu avais une chance sur deux...

Et t'as perdu !
c'est bien l'autre solution qu'il fallait employer. Ou plutôt la solution générale des contextes de formatage.

Peux tu m'explquer rapidos ce qui ne va pas dans ce que j'ai mis en place?

Peux tu m'explquer rapidos ce qui ne va pas dans ce que j'ai mis en place? j'obtiens pourtant le rendu souhaité

Modifié par Nickargall (13 Dec 2006 - 14:07)

Nickargall a écrit :
Peux tu m'explquer rapidos ce qui ne va pas dans ce que j'ai mis en place? j'obtiens pourtant le rendu souhaité

L'utilisation de div vides

<div class="clear"></div>

Alors qu'il y a d'autres solutions qui préservent mieux le code html

Obtenir le rendu souhaité n'est qu'un des aspects de l'emploi des css en fait.

Ok. Merci pour cette réponse. j'en suis encore qu'aux débuts du css, pas encore utilisé l'attribut ID, enfin bref plein de choses à faire encore .. promis, quand je serai devenu meilleur, j'utiliserai les balises à meilleur escient pour l'instant j'obtiens ce que je veux donc je vais laisser tel quel.

Nickargall a écrit :
j'en suis encore qu'aux débuts du css, pas encore utilisé l'attribut ID

Tant qu'on y est: Quelle est la différence entre une classe et un id ?

Eh j'ai pas dit que je savais pas ce que c'était, juste que j'l'ai pas encore utilisé ,)

Nickargall a écrit :
Eh j'ai pas dit que je savais pas ce que c'était, juste que j'l'ai pas encore utilisé ,)

Ah heu... d'accord. Je vois pas très bien pourquoi mais bon...

Parce que !

Merci du complément d'infos en tout cas.