web-dev-qa-db-fra.com

La requête @media ne fonctionne pas dans le mobile. Fonctionne bien dans Chrome

J'essaie de faire en sorte que cela fonctionne mais, d'une manière ou d'une autre, cela ne fonctionne pas dans le mobile. quand j'utilise l'outil chrome pour remplacer la taille de l'écran, cela fonctionne bien. Je ne suis pas sûr de ce que je fais mal. s'il vous plaît aider

@media screen and (min-device-width : 320px) and (max-device-width : 480px) {
            .container .backgroundImage { display: none; }
}

enter image description here

Il y a une image d'arrière-plan lors de l'affichage dans le navigateur. s je voudrais supprimer cette image si elle est vue dans un téléphone mobile MAIS sa ne fonctionne pas en quelque sorte .. aide s'il vous plaît

=============

ESSAI SUR IPhone 3G, 4, 5, Android Galaxy Nexus

cssgoogle-chromemedia-queries
28
patel.milanb

@Andy a raison, vérifiez votre device-widths ou vous pouvez toujours utiliser min-width pour ne pas avoir à connaître la largeur de chaque appareil. 

Quoi qu'il en soit, assurez-vous d'avoir une balise viewport, telle que <meta name="viewport" content="width=device-width,initial-scale=1.0">.

92
Adam Simpson

Fantastique - j'ai oublié la fenêtre aussi! Fot all: Il suffit d'ajouter

<meta name="viewport" content="width=device-width,initial-scale=1.0">

dans ta tête

15
romedius33

Je sais que ceci est un ancien post, mais j'ai récemment eu un problème comme celui-ci. J'ai finalement résolu le problème en supprimant la requête multimédia CSS de la feuille de style CSS principale et en saisissant les besoins spécifiques du mobile dans la section de style html. Je ne sais pas pourquoi cela a fonctionné, mais ça a fonctionné.

1
Pops Jones