当灯箱打开时，CSS Media查询会被覆盖

Question

当屏幕小于1000px时，我有一个CSS媒体查询覆盖元素。媒体查询工作正常，直到我打开一个颜色框，此时媒体查询被以前的样式覆盖。

我的代码是：

master.css

#header .holder {
...
width: 960px;
...
}

mobile.css

@media all and (max-width: 1000px) and (min-width: 320px) {
  #header .holder {
  ...
  width: 100%;
  ...
  }
}

当我打开彩盒时，我会在Chrome的CSS检查器中看到它：http://i.imgur.com/mhWvF.png （之前的样式是覆盖媒体查询的那些）

为什么代码会被覆盖？什么事件是在窗口中触发彩色框来实现这一目标？

Answer 1

彩盒的作者。我以前没有听说过这个问题，但它可能是你在彩盒中显示的内容的结果。

像这样的奇怪问题通常是由于人们不正确地将HTML文档作为ajax打开，而不是在iframe中显示它们。由此产生的无效HTML，脚本和样式混合会导致各种问题。

我的猜测是，这是您的实施所特有的。我建议尝试在jsfiddle.net中创建问题的简化演示，并在此处发布链接，或者发送到colorbox的问题跟踪器。