IE9在加载时使用非外部CSS加载错误的媒体查询信息

Question

我有一个页面在<style>标签中使用非外部CSS ,在这些<style>标签中是以下媒体查询:

@media screen and (max-width:768px){
/* CSS */
}

所有这些都在Firefox中运行良好,CSS为768px宽度,仅在应该的时候呈现.但是,在IE9中,无论大小如何,此媒体查询中的CSS都会在加载时呈现.

然而,在加载之后,如果我根本改变浏览器大小,它会像桌面版一样重新呈现.所以基本上,IE9非外部样式表似乎是渲染所有CSS,无论是在媒体查询中它是否匹配,但是如果浏览器调整大小,则呈现正确的CSS,甚至是像素.

有谁知道这到底发生了什么,或者是否有快速修复？我能够想到的唯一解决方案是通过重新排序我的CSS并添加新的媒体查询来解决这个问题,我希望避免更新代码.

Answer 1

我在ie10中遇到了与外部css文件类似的问题.我通过给查询至少1px(0px似乎不起作用)来修复它.

它并没有解决我所有的问题,但对你来说可能已经足够了.

@media screen and (min-width: 1px) and (max-width:768px){
/* CSS */
}