СМИ запросы, пропуская пиксель ⇐ CSS

[Anonymous]

У меня есть следующая проблема: < /p>
Я написал этот код в CSS: < /p>
/* Extra small devices (phones, 480px and down) */
@media only screen and (max-width: 480px) {
body {
background-color: red;
}
}

/* Small devices (portrait tablets and large phones, 481px up to 769px) */
@media only screen and (min-width: 481px) and (max-width: 768px) {
body {
background-color: blue;
}
}

/* Medium devices (landscape tablets, 769px up to 1024px) */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
body {
background-color: green;
}
}

/* Large devices (large laptops and desktops, 1025px up 5o 1440px) */
@media only screen and (min-width: 1025px) and (max-width: 1440px) {
body {
background-color: blueviolet;
}
}
< /code>
При тестировании отзывчивости этого кода в моем браузере цвет фона переключается на цвет по умолчанию для одного пикселя, прежде чем перейти к определению следующего стиля с предстоящим пикселем. Ширина меньше 480px "src =" https://i.sstatic.net/ityfsc0j.png "/>
Когда ширина экрана ровно 480px, фоновый цвет становится белым (цвет по умолчанию):

Фон становится синим, когда ширина увеличивается до 481px:
< /p>

может кто -нибудь объяснить мне, в чем проблема?
Почему это внезапно выходит из белого? Есть ли способ исправить это?

Спасибо всем, кто хочет мне помочь.

Подробнее здесь: https://stackoverflow.com/questions/796 ... ng-a-pixel