Why do media queries work weird in Chrome browser?

Question

css

The essence of the question is simple: "Why does the media tag not work correctly in the Google browser."
There is a code:

@media screen and (min-width: 1024px) and (max-width: 1440px) {
  #menu button {
    font-size: 1.2em;
  }
}

@media screen and (min-width: 1441px)  {
  #menu button {
    font-size: 1.5em;
  }
}

In Opera, it works correctly, but in Chrome, problems begin with it. With my resolution of 1366 it works like with a resolution of 1441. When you include the source code, it starts working fine. When you take out the source code in a new window, everything repeats again. But when you reduce the window to 1353 pixels, the size of the text becomes 1.2em.
On another page (with the same menu) everything works correctly.
What is the problem?