2015-10-07 70 views
0

我试图弄清楚为什么,但似乎没有任何工作,我看到的有关'媒体查询被忽略'的所有其他问题都是由于未设置媒体查询以正确的方式或不在正确的地方。我已经看过答案,他们都没有解决这个问题(似乎是)的独特问题。在CS购物车中被忽略的媒体查询

所以这里是我的代码,我使用CS购物车4中的自定义CSS编辑器。它使用内置于其核心中的LESS和Bootstrap 2。这是我迄今写的。你能发现任何问题吗?

@-ms-viewport { width: device-width; } 
@viewport { width: device-width; } 

@media screen and (max-width: 1200px) { 

    .nav-menu { margin: 0; } [...] 

} 

,因为它是一个地方发展的系统上,但基本上没有,我在头一个菜单,我不能提供一个链接到该网站。一旦屏幕低于1200px,菜单会被压扁一点,所以我想改变它,使它看起来更漂亮,并且优雅地降低屏幕尺寸。问题是;我的全套媒体查询被忽略。

有什么建议吗?我完全被这一个难住了。

+0

尝试使用'@media只有屏幕和(最大宽度:1200像素){...' – vivekkupadhyay

+0

谢谢,我使用的替换1200像素行并将其半作品。所以现在它正常降解1200px,但其他媒体查询下面的979px,767px和480px仍然不起作用。我发现,当我从Custom CSS主题编辑器中删除所有内容并将其保存为空时,然后再将所有CSS再次粘贴到1200px的作品中。为什么这样做? –

+0

好吧,@vivekkupadhyay给出的答案是半固定的。我还发现,如果从编辑器中删除所有内容(如上所述)并保存样式。再次将CSS粘贴到编辑器中并保存,然后按预期方式正常工作。这花了几个小时。希望这可以为有相同问题的其他人清理一些事情。抱歉浪费任何人的时间! –

回答

0

您可以检查它是如何工作的CS-车在下列文件:

设计/主题/响应/ CSS/tygh/responsive.less

这里是一个可以正常工作的例子。没有任何额外的改变是必需的

@media (max-width : 1200px) { 
    .nav-menu { margin: 0; } 
}