Une propriété de mon responsive ne s'applique pas.. dans certains ca

Bonjour,

Voilà, mon responsive marchait très bien quand je l'ai réalisé mais ce n'est plus le cas.

La largueur que j'ai donné en responsive ne s'applique plus mais seulement dans certains cas. Pour savoir si le navigateur reconnait ma propriété CSS j'ai appliqué un background-color bleu et il s'affiche quand je modifie la taille manuellement dans l'outil de preview mais ne s'affiche pas quand je sélectionne directement un format définit (ex Iphone 7)... Je n'y comprends rien

Bonjour,

Assez étrange en effet.
Avez-vous bien mis la meta viewport ?
Vous n'avez pas un zoom appliqué ? En css ou sur le browser ?
Quand vous testez en fixant les dimensions, vous n'êtes pas à la limite qui passe entre deux media query ?

Pouvez-vous fournir le code pour analyser svp ?

Merci

Bonjour,
il faudrait voir le code, ou un lien. On remarque qu'en manuel, les dimensions sont 362x740, alors que sur Galaxy 9/9+ c'est 360x740. Il se peut que sur l'expérimentation en fond bleu, la limite des @media soit juste à 362, ce qui expliquerait le problème. Et sur les autres résolutions automatiques, ça se passe comment ?
On voit aussi qu'en manuel, les caractères sont plus gros et le marges différentes.. Un problème du côté de meta-viewport ?
Les essais de dimensionnement "à la main" nous font donner des dimensions qui n'existent parfois pas dans la réalité (et en plus on ne redimensionne qu'en largeur). Le mieux est de tester avec de vrais appareils mobiles.

Merci pour vos réponses,

Voilà un screen de mon code, malheureusement non j'ai seulement appliqué un @media à moins de 650px de large

Peut importe la taille que je dimensionne manuellement, mon responsive s'applique correctement. J'ai fais l'essaie sur mon propre téléphone pour voir quelle "version" y été appliqué et c'est la mauvaise... évidemment sinon c'est pas drôle

C'est bon j'ai trouvé le problème ! J'avais simplement oublié la balise
<meta content="width=device-width, initial-scale=1" name="viewport" /> dans mon html !

Merci pour votre aide