Question

我在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？它是媒体查询的东西，可能是它们的顺序？

Answer 1

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

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

不知道为什么会有效。

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

1 个答案: