Mettre le bas de 3 div au même niveau
Résolu
griko
Messages postés
343
Date d'inscription
Statut
Membre
Dernière intervention
-
PMax-57 Messages postés 195 Date d'inscription Statut Membre Dernière intervention -
PMax-57 Messages postés 195 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je voudrais Mettre le bas de 3 div au même niveau et que quand l'une des div augmente, les deux autres augmentes aussi,
comment faire ?
je voudrais Mettre le bas de 3 div au même niveau et que quand l'une des div augmente, les deux autres augmentes aussi,
comment faire ?
A voir également:
- Mettre le bas de 3 div au même niveau
- Ai suite 3 - Télécharger - Optimisation
- 3 emoji - Forum Mail
- Picasa 3 - Télécharger - Albums photo
- Photorecit 3 - Télécharger - Visionnage & Diaporama
- Mise a niveau windows 7 vers 10 - Accueil - Mise à jour
12 réponses
Bonjour,
Insère ces trois DIV dans une autre ; et pour tes trois DIV, place le style suivant : margin-bottom:0px;
Xavier
Insère ces trois DIV dans une autre ; et pour tes trois DIV, place le style suivant : margin-bottom:0px;
Xavier
griko
Messages postés
343
Date d'inscription
Statut
Membre
Dernière intervention
10
ça ne fonctionne pas !
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Salut,
Ne connaissant pas le code source en entier, je la joue devinette :
essaye style="disply:inline-block;"
Ne connaissant pas le code source en entier, je la joue devinette :
essaye style="disply:inline-block;"
Et bien pour le code, il y a simplement 3 div en position:relative; float:left et les 3 div on une hauteur automatique, et se que je voudrais c'est que ces trois div est leur bottom au même niveau.
Donc, le code donné je le met où ? sur les 3 div ou sur une div qui regroupe les deux ?
Donc, le code donné je le met où ? sur les 3 div ou sur une div qui regroupe les deux ?
Salut,
Alors de là on reprendre l'idée des 3 divisions dans 1 :
Si les divisions div1 div2 div3 ont des largeurs fixes, on imagine 200px pour chacunes, alors on peut utiliser le style :
#contenu : style="vertical-align:bottom; width:600px;"
#div1 : style="position:absolute; margin-left:0px; width:200px;"
#div2 : style="position:absolute; margin-left:200px; width:200px;"
#div3 : style="position:absolute; margin-left:400px; width:200px;"
si le vertical-align ne fonctionne pas, on peut prendre "bottom:0px;" pour les divs 1, 2 et 3. (+1 à reivax)
Normalement ça devrait marcher
Alors de là on reprendre l'idée des 3 divisions dans 1 :
<div id="contenu"> <div id="div1"></div> <div id="div2"></div> <div id="div3"></div> </div>
Si les divisions div1 div2 div3 ont des largeurs fixes, on imagine 200px pour chacunes, alors on peut utiliser le style :
#contenu : style="vertical-align:bottom; width:600px;"
#div1 : style="position:absolute; margin-left:0px; width:200px;"
#div2 : style="position:absolute; margin-left:200px; width:200px;"
#div3 : style="position:absolute; margin-left:400px; width:200px;"
si le vertical-align ne fonctionne pas, on peut prendre "bottom:0px;" pour les divs 1, 2 et 3. (+1 à reivax)
Normalement ça devrait marcher
Bon c'est bon, j'ai trouvé autre chose :
et pour les 3 div
Merci quand même :)
#video_emission_tvc{ float:left; overflow:hidden; }
et pour les 3 div
margin-bottom:-1000px; padding-bottom:1000px;
Merci quand même :)
Salut,
ta solution n'est pas dutout géniale (problèmes de compatibilité avec les différentes résolutions d'écran).
Là, j'ai trouvé un truc valide CSS...
1) Tu fais 1 div principale avec comme CSS :
- width:TALARGEUR
- height:TAHAUTEUR
2) Dans ta div principale, tu met 4 divisions
- div1 : width:0px; height:100px; display:inline-block; vertical-align:bottom;
- div2 : width:TALARGEUR; height:TAHAUTEUR; display:inline-block; vertical-align:bottom;
- div3 : width:TALARGEUR; height:TAHAUTEUR; display:inline-block; vertical-align:bottom;
- div4 : width:TALARGEUR; height:TAHAUTEUR; display:inline-block; vertical-align:bottom;
Dans ta div 1, tu ne met rien.
Dans les autres, tu met ton contenu.
Normalement ça fonctionne (vérifié sur FF et IE 8)
ta solution n'est pas dutout géniale (problèmes de compatibilité avec les différentes résolutions d'écran).
Là, j'ai trouvé un truc valide CSS...
1) Tu fais 1 div principale avec comme CSS :
- width:TALARGEUR
- height:TAHAUTEUR
2) Dans ta div principale, tu met 4 divisions
- div1 : width:0px; height:100px; display:inline-block; vertical-align:bottom;
- div2 : width:TALARGEUR; height:TAHAUTEUR; display:inline-block; vertical-align:bottom;
- div3 : width:TALARGEUR; height:TAHAUTEUR; display:inline-block; vertical-align:bottom;
- div4 : width:TALARGEUR; height:TAHAUTEUR; display:inline-block; vertical-align:bottom;
Dans ta div 1, tu ne met rien.
Dans les autres, tu met ton contenu.
Normalement ça fonctionne (vérifié sur FF et IE 8)