刷新后,ngView for IE内部的媒体查询样式

时间:2014-05-13 13:05:48

标签: javascript css angularjs internet-explorer-10

我在IE10内部的css规则有问题,因为它们是ngView包含的内页(我使用的是Angular 1.0.6)。它适用于其他浏览器(我认为它适用于IE11,没有自己测试过):

我有这样的css:

.checker {
    display: none;
}

@media (min-width: 1041px) {
    .m1 { display: block; }
}
@media (min-width: 980px) and (max-width: 1040px) {
    .m2 { display: block; }
}
@media (max-width: 767px) {
    .m3 { display: block; }
}
@media (max-width: 979px) {
    .m4 { display: block; }
}

和html:

<span class="checker m1">m1</span>
<span class="checker m2">m2</span>
<span class="checker m3">m3</span>
<span class="checker m4">m4</span>

css位于我的页面上的<style>标记内,该标记在ngView中呈现。对于页面lareger然后1041px它显示m1和m3。当我调整浏览器大小时,m3消失了。当我在页面内的样式和html不在ngVew中时,它也可以工作。

这是什么问题? IE10中有错误吗?如何修复我的CSS?它是媒体查询的东西,可能是它们的顺序?

1 个答案:

答案 0 :(得分:0)

我能够通过在该规则中添加min-width来修复它:

@media (max-width: 767px) and (min-width: 100px) {

不知道为什么会有效。