Медиа Query работает на Firefox, но не на Chrome

Question

Я хочу добавить некоторый стиль для размера экрана между 1024px до 1280px, поэтому я использую следующий запрос СМИ:

@media only screen and (min-width: 1024px) and (max-width: 1279px) { 

Мой размер экрана 1280px. В Firefox не отображается стиль, добавленный в вышеприведенный запрос (и это правильно), но Chrome просматривает размер экрана 1280px, отображая стиль, добавленный в вышеупомянутый медиа-запрос.

Почему Chrome на экране 1280px по-прежнему отображает стиль, добавленный в вышеуказанный медиа-запрос? Как я могу исправить вышеупомянутый запрос для Chrome тоже? Спасибо.

Answer 1

Я действительно не уверен, почему у вас возникли проблемы с запросом на медиа. Возможно, вы не устраиваете его правильно.

Обязательный JSFiddle here

body { background: red; } 
@media only screen and (min-width: 1024px) and (max-width: 1279px) { 
    body { background: blue; } 
}               

Я проверил его с Google Chrome на трех различных типах экрана:
1. Ширина менее 1024px
2. Ширина между указанной 1024px и 1279px
3. Ширина более 1279px