[Résolu]Image en float:left et débordement du bloc <div>

Salut à tous,
j'essaie de virer tous les tableaux d'un petit projet personnel pour les remplacer par des bloc <div> mais pour mettre une image sur la gauche, et du texte sur la droite dans le même bloc, j'utilise float:left pour l'image.
L'affichage est celui que j'attend à ceci pres que l'image déborde du bloc <div> (si j'en affiche les bordures). Si j'ajoute donc un autre bloc <div> en dessous, si je ne saute pas assez de lignes, l'image du premier bloc s'affiche par dessus le second bloc...
Comment faire pour à la fois avoir l'image flottante pour pouvoir mettre du texte autour, et agrandir la taille du bloc à la hauteur de l'image pour éviter le débordement?
Ou bien y-a-til une autre façon de faire?
Merci
a+

Salut,

Il te faut utiliser la propriété clear, qui sert à spécifier qu'un élément ne doit pas être juxaposé à un float (et donc se retrouve en dessous). Je te conseille la lecture de cet article.
Si ton but est simplement que le bloc d'en dessous ne se fasse pas recouvrir pas le flottant du bloc au dessus, il suffit que le bloc dans son intégralité soit en clear : left (si ton image est en float : left). Si tu veux mettre un cadre autour de l'ensemble, il te faudra mettre un élément clear à la fin de ton bloc, à l'intérieur de celui-ci.
Je pense que tu comprendras mieux le mécanisme après lecture de l'article.

Je te remercie, j'ai mis un elément clear à la fin de mon bloc, et l'image est bien contenue entièrement dans le <div>
Merci
a+
Modifié par Mayhem (10 Jun 2005 - 07:58)