在移动设备上隐藏 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 仍然可见。我似乎不明白为什么它不起作用。我缺少什么？ 我已尝试使用 CSS 在移动设备上隐藏 div 中列出的所有建议，但似乎无法弄清楚我做错了什么。 这是一支笔来说明问题......将其大小调整到 720px 以下，桌面专用的 div 不会隐藏

http://codepen.io/anon/pen/vEjvbM

Answer 1

查看此更新版本：

http://codepen.io/anon/pen/azGPxG

使用您提到的相同 CSS：

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