隐藏移动设备上的div无法正常工作

Question

我正在尝试创建一个类，我可以使用它来隐藏网站移动版本上的某些div。我正在使用的CSS是

@media screen and (max-width: 720px) {.desktop-only { display: none !important; }}  

视口设置为

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

然而，当我在分辨率小于720px的设备上查看该网站时，div仍然可见。我似乎无法弄清楚为什么它不起作用。我错过了什么？ 我已经尝试了Hide div on mobile devices, using CSS中列出的所有建议，但似乎无法弄清楚我做错了什么。

这是一支笔来说明问题....将其调整为低于720px并且仅限桌面的div不会隐藏http://codepen.io/anon/pen/vEjvbM

Answer 1

我可以看到它有效。您可能忘记在CodePen中添加CSS。

请参阅此更新版本：http://codepen.io/anon/pen/azGPxG

使用您提到的相同CSS：

@media screen and (max-width: 720px) {.desktop-only { display: none !important; }}