Microsoft Edge，媒体查询无法正常工作

Question

我在 Google Chrome 上成功测试了这个媒体查询，但不知何故 Microsoft Edge 有问题。这些查询有问题吗？或者它只是 Microsoft Edge 中的一个错误？

更新：
看起来 Edge 需要 Class 没有媒体查询，所以我添加了 .height-fix{height:650px} 并且它有效。

@media all and (min-width:875px) and (max-width:980px) { 
.height-fix { 
  height : 610px; 
  } 
} 

@media all and (min-width:768px) and (max-width:875px) { 
.height-fix { 
  height : 575px; 
  } 
} 

@media (max-height:768px) and (min-width:1366px) and (max-width:1366px) { 
.height-fix { 
  height : 520px !important ; 
  } 
}

这是不起作用的媒体查询，它应该针对具有 height OVER 768px 和 width 的设备超过 1367px:

@media (min-height:768px) and (min-width:1367px) { 
.height-fix { 
  height : 650px; //this line doesn't apply
  } 
}

Answer 1

如果 class 没有 fallback

，Microsoft Edge 似乎有媒体查询问题

这意味着如果 css class 仅在媒体查询中指定，它有时无法正常工作。

所以如果 CSS 看起来像这样：

@media (max-width(123px){
.height-fix {
  height: 650px
  }
}

它不会工作。它应该看起来像这样：

.height-fix{
height: 100px
}

@media (max-width(123px){
.height-fix {
  height: 650px
  }
}

Microsoft Edge，媒体查询无法正常工作

Microsoft Edge, media query doesn't work correctly

css

google-chrome

media-queries

microsoft-edge