媒体查询不在铬中工作

Question

嗨，我正在实施一个网站的响应式设计。虽然设计在firefox中可以正常工作，但它在PC和移动设备上都不会出现问题。样式表styles-RWD.css是这样的

/*CSS FOR MOBILE DEVICES*/ 

@media screen and (min-width: 0px) and (max-width: 480px) { 

#sidebar { 
    display : none; 
} 

footer { 
    display : none; 
} 
#bann_cb { 
    display : none; 
} 

body { 
width:auto; 
background-color:white; 
font-family: sans-serif; 
color:orange; 
margin:0px 2px 2px 2px; 
padding:0; 
} 
#header { 
display : none; 
} 

#content { 
width:50%; 
padding:0px 2px 2px 2px; 
} 
#box_bharat { 
display:none; 
} 

#form { 
width:auto; 
padding:none; 

} 
#menu-bar { 
width:auto; 
} 

#news_10 { 
display:none; 
} 
#mob_heading { 
display:block; 
width:auto; 
visibility:visible; 
} 

} 
/*end css for mobile devices*/ 

默认样式在此之后。

的index.php文件有这些线路

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
<link rel="stylesheet" type="text/css" href="styles-rwd.css" /> 

现在这个工作在Firefox，但不是在铬。在铬中，它甚至不会触发。我已经在电脑上测试过。当我减小Firefox的浏览器窗口大小时，会触发布局。但这不会发生在Chrome上。在移动设备上也是如此。请帮助。

Answer 1

// media screen only supports max-width 
@media screen and (max-width: 480px) { 

}