Mettre le bas de 3 div au même niveau
Résolu/Fermé
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
-
15 oct. 2009 à 21:09
PMax-57 Messages postés 195 Date d'inscription lundi 15 juin 2009 Statut Membre Dernière intervention 12 février 2017 - 25 oct. 2009 à 11:52
PMax-57 Messages postés 195 Date d'inscription lundi 15 juin 2009 Statut Membre Dernière intervention 12 février 2017 - 25 oct. 2009 à 11:52
A voir également:
- Mettre le bas de 3 div au même niveau
- Picasa 3 - Télécharger - Albums photo
- Mise a niveau windows 10 - Accueil - Mise à jour
- Tiret du bas ✓ - Forum PC portable
- Photorecit 3 - Télécharger - Visionnage & Diaporama
- Ai suite 3 download - Télécharger - Optimisation
12 réponses
Reivax962
Messages postés
3672
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
11 février 2021
1 011
15 oct. 2009 à 21:51
15 oct. 2009 à 21:51
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
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
16 oct. 2009 à 13:34
16 oct. 2009 à 13:34
Personne d'autre n'a d'idées ?
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
16 oct. 2009 à 23:16
16 oct. 2009 à 23:16
Up!
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
21 oct. 2009 à 14:21
21 oct. 2009 à 14:21
Personne ne sait comment aligner 3 div en bas ???
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
PMax-57
Messages postés
195
Date d'inscription
lundi 15 juin 2009
Statut
Membre
Dernière intervention
12 février 2017
40
21 oct. 2009 à 16:31
21 oct. 2009 à 16:31
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;"
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
22 oct. 2009 à 19:03
22 oct. 2009 à 19:03
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 ?
Reivax962
Messages postés
3672
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
11 février 2021
1 011
22 oct. 2009 à 19:50
22 oct. 2009 à 19:50
Bonjour,
Me suis trompé, ce n'était pas margin-bottom:0px, mais plutôt bottom:0px...
Xavier
Me suis trompé, ce n'était pas margin-bottom:0px, mais plutôt bottom:0px...
Xavier
PMax-57
Messages postés
195
Date d'inscription
lundi 15 juin 2009
Statut
Membre
Dernière intervention
12 février 2017
40
22 oct. 2009 à 20:11
22 oct. 2009 à 20:11
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
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
22 oct. 2009 à 21:12
22 oct. 2009 à 21:12
ton code ne fonctionne pas !!
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
22 oct. 2009 à 22:14
22 oct. 2009 à 22:14
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 :)
PMax-57
Messages postés
195
Date d'inscription
lundi 15 juin 2009
Statut
Membre
Dernière intervention
12 février 2017
40
22 oct. 2009 à 23:45
22 oct. 2009 à 23:45
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)
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
25 oct. 2009 à 06:40
25 oct. 2009 à 06:40
Oui mais la hauteur n'est pas définie, elle peut changer du coup ta solution ne fonctionnera pas ?!
griko
Messages postés
343
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
29 avril 2014
10
25 oct. 2009 à 08:04
25 oct. 2009 à 08:04
actuellement, ce que j'ai fais (pas ton code) c'est pas compatible avec les versions antérieurs à IE8
PMax-57
Messages postés
195
Date d'inscription
lundi 15 juin 2009
Statut
Membre
Dernière intervention
12 février 2017
40
25 oct. 2009 à 11:52
25 oct. 2009 à 11:52
Retire les height:TAHAUTEUR et ça fonctionnera quand même...
Dans mon code je les avait mises exprès pour avoir par exemple 70px pour 1 div, 200px pour une autre, etc...
Dans mon code je les avait mises exprès pour avoir par exemple 70px pour 1 div, 200px pour une autre, etc...
16 oct. 2009 à 00:02