Некорректно срабатывает media queries?

Question

[Денис]

На сайте tantum.dev.pirogov.ru/test/index.html в планшетной версии или эмуляции в хроме в режиме IPad альбомной ориентации при перезагрузке страницы на секунду показывается зеленая плашка поворота экрана, хотя media queries для нее прописаны только с разрешения 640 пикс.

@media (max-width: 640px) and (orientation: landscape) {
    section, footer, .pageNav {
        display: none !important;
    }

    .splash {
        display: block;
    }
}

Но IPad в альбомной ориентации значительно шире 640 пикселей. Из-за чего тогда может возникать такой баг?

Answer 1

[Виталий Киренков]

У вас фон сайта зеленый, поверх него, тоже фуллскрин - картинка, вот она то еще не успела прогрузиться, вот у вас зелёненькое и мелькает...

Answer 2

[Денис]

так на секунду показывается именно блок splash с фоном поворота экрана моб. устройства, хотя четко прописаны media queries

@media (max-width: 640px) and (orientation: landscape) {
    section, footer, .pageNav {
        display: none !important;
    }

    .splash {
        display: block;
    }
}

из-за которых блок splash, если это планшет, а он явно больше, чем 640 пикселей, не должен показываться вообще.