Falsche Bildschirmbreite auf Chrom

Question

Wenn ich die Größe des Bildschirms des Browsers auf Google Chrome (ich habe nicht versucht, in einem anderen Browser) der angezeigte Wert ist falsch. Es macht meine Arbeit schwieriger, wenn ich eine Medienanfrage verwenden muss. Ich kann keine Antworten darauf finden. Auch wenn das Problem auf Chrome beschränkt ist, würde ich gerne wissen, warum dies passiert.

Ist mit nicht überein

@media screen and (max-width: 1067px) { 
    //do something 
} 

zum Beispiel.

EDIT: Wenn ich die Größe des Bildschirms ändern, um zu sehen, ob mein Layout brach eine bestimmte Breite und wählen Sie die Breite in meiner Medienabfrage verwendet die Abfrage nicht bei dieser Browserbreite ausgeführt, aber wenn ich etwas wie 200px mehr es funktioniert, aber ich verliere die Präzision.

beim vorherigen Beispiel:

Nehmen wir an, nicht Website Google ist, ist meine Seite, und auf dieser Breite (1067px) Ich brauche einen div zu zentrieren.

Wenn ich versuche:

@media screen and (max-width: 1067px) { 
    margin: 0 auto; 
} 

Es wird nicht funktionieren auf den angegebenen Wert (1067px), aber wenn ich so etwas wie max-width setzen: 1267px wird funktionieren, aber verlieren Präzision.

Ich weiß nicht genau, wie viel in px die Variation ist, aber ist etwa 200px.

Das Beispiel der Mitte ein div ist nur ein Beispiel, die Tatsache ist: Nichts auf der Abfrage angegeben bei 1067px Arbeit, wenn ich weiter abnehmen wird funktionieren, aber zu spät, zwingt mich, die 1067px zu 1267px zu erhöhen lauf, wenn ich will.

WICHTIG: Ich habe andere Browser außer Chrome nicht ausprobiert.

Answer 1

@media screen and (max-width: 1067px) { 
    //do something 
} 

Ich verstand nicht, Ihr Problem gut ich denke, aber ich werde erklären, wie @media funktioniert.

Wenn Ihr Bildschirm eine Breite von 0 bis 1067 hat, arbeitet er mit der CSS in diesem @ media-Bildschirm. Es bedeutet nicht, dass es Ihren Bildschirm auf einen bestimmten Wert beschränkt, Sie müssen Ihre Seite so einrichten, dass sie mit einer maximalen Breite von 1067px arbeitet.

Wie dies (mit max-width auf div und anderen Elementen):

<div id="home> 
//content 
</div> 

Und Ihre css so sein würde:

#home 
{ 
    max-width: 1067px; 
} 

Hoffe, das hilft!