标头下拉菜单在移动分辨率上重叠

Question

如此screenshot（移动分辨率）所示，标题下拉子菜单是重叠的。有什么解决办法可以正确显示它们？

<li class="dropdown">
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="nav-opt7">Media<span class="caret"></span></a>
  <ul class="dropdown-menu wow fadeIn">
    <li><a href="image-gallery.php">Images</a></li>
    <li><a href="video-gallery.php">Videos</a></li>
  </ul>
</li>

Answer 1

尝试设置li的填充顶部样式，并且仅使用媒体查询为移动版本设置填充样式，如下所示，

@media screen and (max-width: 650px) and (min-width: 0px) 
{
  Your li element style or padding top style for your li element
}