CSS最大宽度媒体查询的异常行为

Question

多年来，我一直使用max-width和min-width媒体查询来使我的网站具有响应能力，而没有任何问题。但是今天我注意到了一个奇怪的行为：最大宽度规则在限制屏幕宽度时停止工作。例如，如果我将颜色更改为899像素的蓝色，那么它只会以898像素的颜色开始更改。

我不确定问题出在哪里，我在本地和生产环境的多个浏览器中进行了测试，结果是否相同。我什至制作了一支代码笔，并且max-width值不断被忽略：https://codepen.io/anon/pen/LzWWqd

body { background-color: yellow; }

@media only screen and (max-width: 899px) {
    body { background-color: blue; }
}

该CSS的结果是屏幕在899px处呈黄色，不应在该位置，而是蓝色。

这与我的屏幕分辨率有关吗？我唯一更改的是计算机屏幕。我正在1440p屏幕上使用Windows 10。在1080p屏幕上安装Windows 10之前。