Bonjour ! Voila j'ai creer un menu repansive pour que a partir de 768px, ma nav du Header se cache et que mon mene reponsive apparait avec le bouton ! Le soucis c'est que quand je diminue la fenetre de mon navigateur a 768px tout marche correctement, mais quand j'ai essayer sur mon Portable, rien se passe comme prevue le 2 menu apparait et mon menu reponsive est visible, je n'est pas trouvé la solution au probleme, qurlqu'un pourrait m'aider ? Merci d'avance! (Lien: https://zarrox.000webhostapp.com/ExtensionTwitch/index.html)

-
Edité par NicolasRaulin1 30 décembre 2017 à 13:02:07

Salut, je peux essayé de t'aider mais je suis pas expert... LOL

Peux tu envoyer un copie de ton code CSS et le html pleas ?

BoToine-1996 a écrit:

Salut, je peux essayé de t'aider mais je suis pas expert... LOL

Peux tu envoyer un copie de ton code CSS et le html pleas ?

Salut, pas de soucis moi aussi jesuis pas un expert encore^^,bah la je peut pas, en plus j'ai beaucoup de fichier, mais va sur le site est fait inspecter comme sur le Srenn tu verra tout le code ? 

Bonjour,

je pense qu'il manque essentiellement la meta "viewport", voir ici : https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3/mise-en-page-adaptative-avec-les-media-queries#/id/r-1612619

Pense aussi à corriger les petites erreurs de validation restantes : https://validator.w3.org/nu/?doc=https%3A%2F%2Fzarrox.000webhostapp.com%2FExtensionTwitch%2Findex.html

Je m'incline tu es entre de bonne mains MDR

-
Edité par BoToine-1996 30 décembre 2017 à 14:00:07

Lamecarlate a écrit:

Bonjour,

je pense qu'il manque essentiellement la meta "viewport", voir ici : https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3/mise-en-page-adaptative-avec-les-media-queries#/id/r-1612619

Pense aussi à corriger les petites erreurs de validation restantes : https://validator.w3.org/nu/?doc=https%3A%2F%2Fzarrox.000webhostapp.com%2FExtensionTwitch%2Findex.html

Bonjour ! Effectivement j'avais oublier la meta viewport, mais je vien de la rajouter est rien a changé, je pense que le soucis vien d'autre part, le despansive meme fermé se montre touours sur mobile ? Merci d'avoir essayer de m'aider quand meme !

Euh, la valeur de viewport vers où le lien menait était "width=device-width". Il vaut mieux ne pas forcer une largeur comme 800.

Tu peux faire la correction sur ton site pour qu'on voie ça ?

Lamecarlate a écrit:

Euh, la valeur de viewport vers où le lien menait était "width=device-width". Il vaut mieux ne pas forcer une largeur comme 800.

Tu peux faire la correction sur ton site pour qu'on voie ça ?

Oui, je l'avais fait en premier mais rien avait changé. Oui je vient de le remettre, mais aucune difference ?

> Oui je vient de le remettre, mais aucune difference ?

Bah pas pour moi Je viens de charger ton site dans Firefox (Fennec) sur mon téléphone Android, et j'ai désormais bien le menu fermé par défaut, qui s'ouvre quand je clique sur le burger. (par contre, les gros blocs noirs et blancs au-dessus, c'est voulu ?)

Je les bien changé regarde ? 

Ah bon ? bah moi sa fait rien ? et le gros blocs noire non je pense pas Tu peut me montré un screen de ton coter ? Tes sur qu'elle navigateur sur le tel ? 

Mon navigateur est Firefox pour Android.

Voici un screenshot de ce que je vois avec le menu fermé :

Et voilà en menu ouvert :

Ok.

-
Edité par Saint Fleur Jean 30 décembre 2017 à 15:30:13

SainFleurJean > non. Pas sur ce sujet. Ne squatte pas les sujets des autres, crée-en un dédié à ton problème.

 Moi j'ai chrome tu pense que sa peut etre a cause de sa? On est bien d'accord que je doit rajouter juste <meta name="viewport" content="width=800"/> c'est bien se que tu a fait? 

Parce que regarde se que j'ai en menu ouvert et fermé ? Je comprend vraiment rien pour le coup 

-
Edité par NicolasRaulin1 30 décembre 2017 à 15:34:23

Non, il faut bien mettre la version "width=device-width" et pas "width=800" (sinon tu dis que ton viewport fait 800px de large, qui est supérieur à 768px, donc ta media query ne se déclenche jamais.

Euh oui width=device-width excuse moi j'ai copier le mauvais sur le post--' mais je les mis mais sa ne change rien :/ 

Ah, en effet, avec Chrome, on n'a pas le même résultat… Ajoute ";initial-scale=1.0" sans les guillemets mais avec le point-virgule après le "device-width" ?

Ah effectivement j'ai le meme resultat que toi ! Merci pour ton aide l'amis ! Maintenant reste pu a dire au text de venir nous revoir  Merci de m'avoir donner un petit coup de mains !

Ah ben oui mais si sur Chrome ça n'a pas le bon rendu, ça ne va pas…

genre sa ce mais bien le soucis ces que on peut decaller sur la droite ducoup on voit le menu cacher ? ... i effectivement... j'ai modifier quelque element, mais pourquoi sa marche pas sur chrome ?

-
Edité par NicolasRaulin1 30 décembre 2017 à 17:45:52

...

-
Edité par PeguySeffi 30 décembre 2017 à 22:34:40

Salut,

tu devrais re-travailler ton code afin de mieux le comprendre toi-même et pouvoir mieux t'y retrouver

Neitsabb a écrit:

Salut,

tu devrais re-travailler ton code afin de mieux le comprendre toi-même et pouvoir mieux t'y retrouver

certainement mais je mis retrouve dans mon code mais ces pas normale que sa face sa, j'ai regarder plien de tuto quelqu'un ma aide est ces bizarre je suis bloqué 

-
Edité par NicolasRaulin1 31 décembre 2017 à 11:34:36

slt, passe le code de ton menu pour voir

Bonjour,

Pour commencer, je te suggère de mettre tout ton code css dans un seul et même fichier.