1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML

Problème de positionnement: mettre un div à la ligne après plusieurs div en floa [Résolu]

Signaler
Messages postés
166
Date d'inscription
mercredi 27 juin 2007
Statut
Membre
Dernière intervention
31 mars 2014
 -
Messages postés
166
Date d'inscription
mercredi 27 juin 2007
Statut
Membre
Dernière intervention
31 mars 2014
 -
Bonjour à tous,
je vous explique donc mon soucis par un exemple type:

j'ai un div conteneur en position relative contenant 3 div en position float:left. Les 2 premiers blocs sont alignés et le 3è revient logiquement à la ligne, s'alignant à gauche (ils font la même largeur).

Mon soucis est que les éléments suivants (div ou autres n'étant plus en float:left ni right) sont alignés par rapport à ce dernier bloc même en faisant suivre le div conteneur de balises
ou en lui mettant un margin-bottom (je voudrais un retour à la ligne).

Pour pallier à ce soucis, je définis généralement une hauteur à mon div conteneur, ceci résolvant le tout. Mais dans mon nouveau projet, je ne connais pas à l'avance sa taille, plusieurs blocs pouvant être intégrés.
Et biensûr, 1 fois sur 2 le nombre de bloc sera impaire et il y aura un soucis.

J'aimerais donc vos avis et solutions à ce soucis, en espérant avoir été clair (ce qui n'est pas évident, j'en conviens).

En attendant vos suggestions,
merci d'avance.


Signé Sagat
Afficher la suite

2 réponses

Réponse 1 / 2
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
 13
Bonjour,
il existe clear:both pour mettre fin à la ligne
exemple 
<html>
<head>
<title>...</title>
<style type="text/css">
div {
 width : 100px;
 height : 100px;
 border : 1px solid #e0e0e0;
}
.floatleft {
 float: left;
}
.retourligne {
 clear: both;
}
</style>
</head>


DIV 1


DIV 2


DIV 3


DIV 4


DIV 5


</html>

;O)
Réponse 2 / 2
Messages postés
166
Date d'inscription
mercredi 27 juin 2007
Statut
Membre
Dernière intervention
31 mars 2014
 1
Merci PetoleTeam, c'est exactement ce dont j'avais besoin.

Signé Sagat
Répondre Posez votre question