Utilisation média queries

Bonjour,

J'ai fait ce code ci pour que lorsque on est sur pc une photo apparaît et sur smartphone juste un fond blanc.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

#about {   background:url(../img/cuire01.jpg); }   @media only screen and (max-device-width: 320px) {   #about {   background:#FFF; } }

---

Mais rien ne fonctionne pouvez vous m'aider ?
Merci d'avance.
Bonne journée.

Avec max-width au lieu de max-device-width
ça donne ça
=>
https://codepen.io/messinmaisoui/pen/wmrKLY
[EDIT] : Pour moi, mais je peux me tromper, si mon écran est par exemple en 1920 * 1080 alors même en redimensionnant ma fenêtre, je n'aurai
pas d'effet avec max-device-width à 320px par exemple, il faudrait que je visualise cette partie css sur un téléphone avec
un très petit écran <= 320px pour que l'effet s'applique ... ce qui n'est pas le cas de l'instruction max-width ...

320px...
à part sur le Minitel de Mathusalem,
ça fait longtemps que les smartphones ont une résolution bien supérieure...

ok
même avec 480 px cela ne marche pas et max-with non plus.
Si je diminue la taille de ma fenêtre en effet cela marche, mais sur mon iphone 7 rien ne change ...


VTTMAN

Ce n'est pas une class pour mon body mais une id pour une section <section id="about">
Merci.

Et qu'elle est la résolution de ton iPhone 7 ? :weird:

vu sur site 750 px mais lorsque je met 750 px rien ne change sur le smartphone mais bien sur une re dimension de la fenêtre sur pc

Voila cela marche maintenant le refresh du navigateur safari met un peu de temps apparemment ;)
Merci pour votre aide à tous.
Bonne journée.