对于响应式顶部导航，我可以添加到当前查询中？

Question

http://pixphoriad.net

这是我在半响应式设计中的第一次拍摄。我找到了一个流畅的导航代码（我复制面食查询，因为我不知道很多关于它们），但不幸的是它基于宽度低于680px凝聚到菜单按钮，大多数智能手机是非常高的res（我假设这就是为什么它在我的S7上不起作用的原因。有什么简单的东西我可以添加到这个查询或更改它以使其功能更好一点？我宁愿保持我的代码的这一部分相当简单。

@media screen and (max-width:680px) {
  ul.topnav li:not(:first-child) {
    display: none; 
  }

  ul.topnav li.icon {
    float: right;
    display: inline-block;
  }
}

@media screen and (max-width:680px) {
  ul.topnav.responsive {
    position: relative;
  }

  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  ul.topnav.responsive li {
    float: none;
    display: inline;
  }

  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }
}