全屏响应式菜单

Question

在移动版本中，我想以全屏视图的形式将菜单栏与屏幕中间的文本一起移动，但将菜单按钮保留在右侧

这是网站 www.growthbetter.com

感谢您的帮助！

Answer 1

您可以使用@media屏幕来实现。在宽度小于480px的屏幕中，.main导航不应具有绝对位置。

@media screen and (max-width: 480px) {
  .main-navigation {
    position: relative;
    width: 100%;
  }
  .menu-toggle {
    position: absolute;
    right: 0;
  }
}