html - IE9 忽略同一样式表中的 *some* 媒体查询

Question

我有一个响应式网站:http://wnmu.edu 在除 IE9 之外的所有其他现代浏览器中，一切似乎都运行良好。

似乎只有某些@media 查询被识别，即使它们在同一个样式表中。看看这个截图:

菜单“关于WNMU，在校学生...”是可见的，它原本隐藏在小于480px的屏幕中。但是，汉堡菜单仍然可见。我的 CSS 代码看起来很简单:

@media only screen and (min-width: 784px){
    .banner #responsive_menu_toggles {
        display: none;
    }
}

我关闭了功能模式。

谢谢。

Answer 1

看起来这个问题以前在这里问过一次。

Media query not working in IE9

Just in case anyone is crawling SO for an answer to this, the above two answers aren't solving the core problem which is answered here - CSS media query not working in IE 9

Basically inline CSS3 media queries DO work in IE9 but you have to disable Compatibilty mode -

<meta http-equiv="X-UA-Compatible" content="IE=9"> 

The above meta tag needs to be placed before any other meta tags otherwise IE9 will default to compatibility mode on and will subsequently not work.

如果你很好奇，我通过在谷歌上搜索 ie9 @media css issues

找到了这个