HTML5 Boilerplate +媒体查询不能在IE8中使用? [英] HTML5 Boilerplate + Media Queries not working in IE8?

问题描述

由于Boilerplate具有内置的response.js，因此从理论上讲它应该能够支持以下CSS:

@media only screen and (max-height: 580px){.rnd-class{:height:200px !important;}}

在FF和Chrome中，它可以按预期工作，并且自定义样式会在调整浏览器窗口大小后开始显示.

但是，在IE8中，始终启用自定义样式-不管当前浏览器窗口有多大.

我当时以为问题出在我的代码中，但是后来我访问了 Boilerplate移动模板，然后我已经注意到，它也会在Browser rezize上更改其布局，并且使用默认样板中的相同媒体查询.

但是，即使移动Boilerplate 也仅适用于FF和Chrome.使用IE8进行访问时，媒体查询没有启动，我得到了最小设备的版本.

现在我的问题是:你们在IE8中也有同样的经历吗? 此网站在IE8中如何寻找您，它会根据当前浏览器窗口的大小更改其样式吗?

或者它可能与我的特定IE版本有关? (我现在无法在其他IE版本上对其进行测试.)

也许，也许也许，某人知道解决方案吗?

P.S.我目前使用的是HTML5 Boilerplate随附的默认"Modernizr"(带有内置的react.js)脚本.

解决方案

首先，您提到您没有访问其他版本的IE的权限，您看到过Boilerplate mobile template and I have noticed that it changes its layout on Browser rezize too and it uses the same media queries from the default Boilerplate.

However, even the mobile Boilerplate only works with FF and Chrome. Visiting it with IE8, the media queries dont kick in and I get served the version for the smallest device.

Now my question is: do you guys experience the same in IE8? How does this site look for you in IE8 and does it change its styles depending on the current browser window size?

Or is it probably related to my specific IE version? (I cant test it on another IE version right now).

And maybe, just maybe, some1 knows a solution to this?

P.S. I am currently using the default "Modernizr" (with respond.js build-in) script that comes with the HTML5 Boilerplate.

解决方案

As an initial aside you've mentioned you haven't got access to other versions of IE, have you seen IETester? Using this tool I'm seeing the same behaviour as you where IE8 is not changing the styles in response to window size changes. IE9 correclty shows the main title resizing when the window size is reduced.

这篇关于HTML5 Boilerplate +媒体查询不能在IE8中使用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！