Partage

Question flex et possition absolute

13 avril 2018 à 16:59:20

Bonjour, j'ai deux probleme sur un site actuellement:

- le 1er est sur les images du portfolio, sur un ecran 24" je passe de 4 images par ligne à 3 ( normal j'ai mis la fonction flex-wrap: wrap; ) j'aimerais savoir si il es possible de fixer le nombre d'image par ligne ?

- 2eme, sur mon formulaire de contact en bas de page, il "remonte" quand je diminue la fenetre ( je l'ai placé avec la fonction position: absolute ), y'a t-il un moyen de le fixer en bas sans qu'il remonte ?

Voici le site en question: http://eddyhubert.weax.net/projet1/

Merci d'avance

Vous êtes demandeur·se d'emploi ?
Sans diplôme post-bac ?

Devenez Développeur·se web junior

Je postule
Formation
courte
Financée
à 100%
13 avril 2018 à 18:14:08

Bonjour Eolynas

2eme question :

mets un position:relative sur le footer parent du formulaire #contact

et redéfinit ton bottom de #contact

1ere question :

si tu définis ta classe imagepf a :

.imagepf {
 width: 33.333333%;
 padding: 10px;
 min-width: 33.33333%;
 box-sizing: border-box;
}

cela devrait forcer a avoir toujours 3 img par ligne

après il faudra adapter l'image avec un max-width : 400px ou pas à toi de voir

-
Edité par AliasDmc 13 avril 2018 à 18:25:01

Découvrez les Css avec la zonecss.fr
13 avril 2018 à 18:25:36

Merci de ta réponse,

Le soucis es que si je met en position relative, il y a un blanc en bas apres

13 avril 2018 à 18:33:50

Bonjour,

Je ne vois pas très bien mais c'est bien la balise footer qui à la position relative et non #contat ?

-
Edité par AliasDmc 13 avril 2018 à 18:34:47

Découvrez les Css avec la zonecss.fr
13 avril 2018 à 18:48:23

C'est sur le footer qu'il faut que tu le mettes.
Puis changer le bottom: -255% de ton formulaire, exactement comme AliasDmc l'a dit.

Ça permettra à ton formulaire de se positionner par rapport au footer.

Là, ton formulaire est positionné à 255% de la hauteur de ta fenêtre vers le bas, en partant du bas de ta fenêtre.
Du coup c'est normal que sa position change lorsque tu resize le navigateur. 

-
Edité par Syltaen 13 avril 2018 à 18:51:44

13 avril 2018 à 19:04:12

Je vois pas trop pourquoi le mettre sur le footer mais je vais tester ca, je suis sur mon tél donc je verrais demain

Car là je vois pas trop pourquoi on dois mettre la position absolute sur le footer alors que je vais modifier l'emplacement du formulaire

Peut être trop bosser aujourd'hui lol

Merci en tout cas pour vos reponses

13 avril 2018 à 19:23:53

Tu dois laisser le position absolute sur le formulaire et mettre un position relative sur le footer.

Un élément qui est en position absolute se positionne par rapport à son parent le plus proche ayant une position différente de "static" (qui est la position de base).

Donc en mettant "position: relative" sur le footer, ton formulaire se positionnera par rapport à lui.
Si après tu mets "bottom: 100px" sur ton formulaire, il se placera à 100px à partir du bas du footer.

C'est un concept très important à garder en tête quand on utilise "position: absolute".

13 avril 2018 à 19:33:11

Bonjour

Le fait de mettre un position:relative sur le footer permet de redéfinit le point d'origine sur lequel bottom #contact va se positionner

cite :

Car là je vois pas trop pourquoi on dois mettre la position absolute sur le footer alors que je vais modifier l'emplacement du formulaire

J'ai pas dit position absolute j'ai dit position relative

Découvrez les Css avec la zonecss.fr
13 avril 2018 à 21:33:12

Ahhh ok merci led gars je viens de comprendre 

Je reviens vers vous si besoin mais j'ai saisie le truc

Merci encore vous m'avez appris un truc ;)

14 avril 2018 à 22:55:50

Et concernant mon problème avec flex sur des petit ecran ( genre 15" ) quelqu'un a une idée ?
16 avril 2018 à 18:45:12

Bonjour Eolynas,

La proposition faite dans ma première réponse ne te convient pas? 

Découvrez les Css avec la zonecss.fr
17 avril 2018 à 1:11:01

Je n avais pas vu ta réponse ( jai regarder via le téléphone c'est moi pratique )

J'ai mis 20% et cela fonctionne bien

Me reste plus qu'à voir avec l'effet de "survol" qui bouge dans tout les sens quand je diminue la fenêtre et ca sera bon

Merci encore 

Question flex et possition absolute

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown