jquery - 自定义响应式导航菜单 (Naver)

Question

我正在使用Naver jQuery 插件创建响应式导航菜单，但我很难实现所需的布局。我在这里设置了一个小提琴。我已将媒体查询断点配置为 640 像素，虽然我希望导航菜单在“非移动”状态下浮动，但当插件初始化时，我希望列表项填充 100% 的标题宽度，在“徽标”下方居中文本，我想在左上角坚持。我试图找出我需要相应调整哪些布局元素。

@media screen and (max-width: 640px) {
   nav li {
      float: none;
      width: 100%;
      text-align: center;
   }
}

感谢您在这里提供的任何帮助。

Answer 1

如果你用这个替换你的css，我认为这就是你要找的。

nav {
    width: 100;
}
nav ul {
    display: table;
    list-style-type: none;
    width: 100%;
}
nav li {
    display: table-cell;
    text-align: center;
    margin-right: 10px;
}