Medienabfragen in CSS funktioniert nicht zwischen Geräten

Question

Ich habe das Responsive Web Designer-Add-on in Chrome verwendet, um put targeting 320 x 480, 480 x 320, 600 x 800, 800 x 600, 768 x 1024 und 1024 x 768.

I verwendet:

@media screen and (max-width: 480px){ my code } 
@media screen and (max-width: 320px){ my code } 

... Struktur diejenigen Ort ansprechbar zu machen.

Wenn ich dieses Layout überprüfe, funktioniert es schön den Browser. Wenn ich ein echtes Gerät wie Samsung Galaxy Core Prime im Hochformat bekomme, zeigt es mir schön. Aber im Landscape-Modus gibt es mir nicht die richtige Ausrichtung.

Auch, wenn ich für meine Website von einem anderen Gerät mit 360 Breite Ansicht Portgröße Bildschirm überprüfen die Media-Abfragen, die ich für 480 geschrieben habe, nicht die Wirkung.

Ich möchte den Code, den ich für 480 geschrieben habe, auf ein Gerät zwischen 320 und 480 Gerät anwenden.

Was habe ich hier falsch gemacht?

Answer 1

@media screen funktioniert nur auf die spezifischen Bildschirme so einige Geräte mit verschiedenen Größen überspringen können

verwenden stattdessen

@media all and (max-width: 480px){ my code } 
@media all and (max-width: 320px){ my code } 

Answer 2

@media all and (max-width: 480px) and (min-width 321px){ my code } 
@media all and (max-width: 320px){ my code }