媒体查询在 Firefox v10 中不起作用答案

【问题标题】：Media queries not working in Firefox v10媒体查询在 Firefox v10 中不起作用
【发布时间】：2012-03-15 03:50:54
【问题描述】：

我一直在我的主样式表中使用媒体查询来根据屏幕大小加载不同的样式。

在我升级到 Firefox v 10.0 之前一切正常。现在媒体查询没有被拉入，并且似乎 Firefox 忽略了一些定义为百分比的宽度。

这是我正在使用的媒体查询的示例：

@media screen and (max-width: 800px) { 
body { background: #ddd; }
}

我一直能够通过缩小浏览器窗口来进行测试。 Chrome、Safari 和 Opera 都按预期工作。 IE 像往常一样忽略它，尽管在宽度上比 firefox 更好。

还有其他人在使用 Firefox 时遇到这个问题吗？

【问题讨论】：

它似乎仍然适用于这样的页面：quirksmode.org/css/mediaqueries.html。你有实际的页面供我们测试吗？
是的。您可以使用socialmarketingandtraining.com 如果您在 chrome 和 firefox 中启动此站点，您会看到 chrome 缩小了。当它到达某个点时，它会将侧边栏放在内容区域下方并隐藏功能区域。这在 Firefox 9 中有效。
注意：此主题为首次访问者设置了一个 cookie，以显示不同的功能。您需要刷新才能看到我正在谈论的功能区域。感谢您的努力
对我来说在 Firefox 和 Chrome 中看起来是一样的。 Chrome 确实对包含不安全内容的https 页面发出了警告。您的样式表是否在 http 上提供？
你使用的是什么版本的火狐？侧边栏是否移动到 Firefox 中的内容下方。我不确定如何修复 chrome 中的 https 警告。

【解决方案1】：

我正在测试 Firefox 的 Firebreak 插件，它破坏了小尺寸（

【讨论】：

【解决方案2】：

您在安全模式下看到问题了吗？

我猜您安装了一些扩展程序，该扩展程序在 Firefox 10 中重新启用（默认情况下将扩展程序视为兼容），并且此扩展程序可防止您的实际浏览器视口随着浏览器窗口缩小。例如，当这种情况发生时，您应该会看到右侧的垂直滚动条从视口中消失。你看到这种情况发生了吗？

【讨论】：