Iphone 4 prend l'affichage de max-width 320px

Salut, j'ai commencé à adapter un site pour mobile et j'ai commencé par faire la version iphone4 en paysage donc avec une largeur de 960px.

Quand je n'avais que cette média query dans mon fichier css le site passait très bien sur iphone mais depuis que j'ai créé d'autre média queries (je suis allé jusque max:width: 320px)
eh bien quand je vais sur le site avecun iphone 4, l'interface affichée est celle prévue pour pour les petites résolutions de 320px de large !

Je précise que sur mon android qui a cette résolution le site s'affiche tout à fait corretement.

J'ai utilisé les média queries comme suis :

@media (max-width: 960px) {
...
}

en partant de 960px et en continuant pour 800px, 640px, 480px, et 320px.

Aussi dans mon header, j'ai rajouté cette méta :

<meta name="viewport" content="width=device-width" />

Je ne sais pas pourquoi l'iphone tombe dans la media query destinée
aux petites résolution de 320px ni comment rétablir ce problème?

Merci!

Désolé pour le double post mais je vois que raphael a écrit dans un autre sujet:

En fait, même si la résolution physique de l'iPhone4 est de 640px de large, son "device-width" est de 320px (comme l'iPhone3). De ce fait, si tu fixes la largeur avec width=device-width, il n'affichera que 320px de large et il est normal que l'image dépasse.

Il semble donc que ca soit un problème avec la meta mais alors, quelle serait la bonne méta à utiliser?

Au cas ou, la réponse m'interesse toujours...

un ptit UP pour un problème intéressant à résoudre

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

@media screen and (min-device-width:1px) and (max-device-width:999px)

Bonjour,

En fait je n'ai pas compris la résolution.

- Par défaut (sans meta viewport), l'iPhone a une largeur (viewport) de 980px
- Avec un meta viewport width=device-width, l'iPhone a une largeur (viewport) de 320px

Ceci étant établi, que souhaites-tu faire ?

Cibler iPhone ? Ne pas cibler iPhone ? Autre ?