html - 媒体查询在 mozilla 中不起作用

标签 html css media-queries

我已经为 chrome 和 mozilla 编写了媒体查询 css。它在 chrome 中工作正常。但在 mozilla 中不起作用

@media screen and (min-height:650px)
 {
  #customerspeak .flexslider .slides .customerBackground img {
  height: 100vh; 
 }
 #customerspeak .flex-direction-nav a {
   margin-top: 37%;
 }
 #customerspeak .flex-next {
  left: 62.5% !important;
 }
 #customerspeak .flex-prev {
  left: 34% !important;   
  }  
 @-moz-document url-prefix() {

   #customerspeak .flexslider .slides .customerBackground img {
   height: 100vh; 
  }
  #customerspeak .flex-direction-nav a {
   margin-top: 37%;
  }
  #customerspeak .flex-next {
  left: 62.5% !important;
 }
 #customerspeak .flex-prev {
 left: 34% !important;   
 }   
}
}

最佳答案

@media 查询之前先尝试使用 @-moz-document url-prefix()

@-moz-document url-prefix() {
    @media screen and (min-height:650px) {
       /* insert code here*/
    }
}

关于html - 媒体查询在 mozilla 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42218255/

相关文章:

javascript - 链接图标跳到父级下方

css - 如何使用 CSS 将字符居中放置在框中?

html - 媒体查询断点不准确

CSS @media - 超过最大宽度后停止拉伸(stretch)内容

javascript - 用于编号导航的 jquery 插件

html - 输入非常小的 Bootstrap

html - 图片链接之间的 CSS 差距无缘无故

css - 我的网站在打印时缩放,使黑色文本看起来是灰色的

html - 隐藏 Tumblr 主题索引页中带有特定标签的帖子

jquery - 在容器内重新排列 div 并保存新 View 的推荐方法