Float et hauteur de l'élément parent

[Schwarzer Stern]

Bonsoir,
J'utilise parfois "float:left;" pour aligner un élément comme un menu à gauche du contenu (par exemple). Cependant, dans certains cas, l'élément flottant est plus haut que l'élément parent qui le contient, ce dernier ne s'adaptant pas à la hauteur du flottant. Cela pose évidemment problème.
Si je ne suis pas clair, j'ai mis un exemple en ligne :
http://www.vanylla.info/exemple.php



Merci pour l'astuce éventuelle (en général, j'utilise du javascript, mais s'il existe une solution plus simple ou plus fiable, j'aime autant).

 

[momo-fr]

Tu trouveras plein de sources sur ce sujet… avec diverses solutions suivant que tu n'as qu'un élément qui pousse ou un ensemble de boîtes de hauteurs différentes…

Voilà de quoi cogiter quelques instants…

 

[Niconemo]

Au sujet des "diverses solutions" propoées dans un lien ci-dessus.
Le système d'une div "clear" avec clear:both est présenté comme "mal" si elle est vide.
Mais dans la plupart des designs, il y a un footer qui peut remplir cet office sans ajout d'une div vide.

 

[Benjamin D.C.]

overflow:auto sur le parent et c'est réglé

 

[Schwarzer Stern]

En effet l'overflow règle tout ça bien simplement (trop simplement, c'est louche ^^) ! Merci à vous tous, j'avais également expérimenté le clear et ça fonctionnait, mais pas très "proprement" en effet.
Merci encore et à bientôt

 

[Benjamin D.C.]

En effet l'overflow règle tout ça bien simplement (trop simplement, c'est louche ^^) ! Merci à vous tous, j'avais également expérimenté le clear et ça fonctionnait, mais pas très "proprement" en effet.
Merci encore et à bientôt

C'est pas louche, c'est juste une feature de CSS Les gens pensent souvent que CSS c'est de la bidouille… mais ces mêmes personnes connaissent généralement très mal CSS

 

[Nihonium]

salut,

pour le placement en CSS y'a un très bon tutoriel ici : Grafikart.fr.

Je suis sûr que tu y trouveras tes réponses, il est vraiment très clair et avec des exemples visuels (l'avantage d'un tuto vidéo).

A+

 

[Benjamin D.C.]

pour le placement en CSS y'a un très bon tutoriel ici : Grafikart.fr.

<autopromo>

Et aussi:

• Initiation au positionnement CSS
• Mise en page CSS avancée grâce à la propriété display

</autopromo>