如何解决我固定的导航栏滚动问题？答案

【问题标题】：How can I fix my fixed navbar scrolling problem?如何解决我固定的导航栏滚动问题？
【发布时间】：2020-04-26 21:05:48
【问题描述】：

我正在尝试为其移动版本的网站模拟“Instagram”样式菜单。一切都很好，但问题是我的 x 和 y 轴有一点滚动问题，其中有几个像素超出预期。

我想让它 100% 固定，这样就不会触发滚动。

我会粘贴代码，但由于我使用的是商业 Wordpress 主题，所以我发现它过于复杂。

网站网址是：

非常感谢

实现：我提供了两个屏幕截图来支持我的问题。第一个是导航栏的当前状态。在第二个中，我寻求的结果。不要注意未对齐的图标。提供第三张图像以综合我的曝光，并可能使问题更清晰。

【问题讨论】：

您能否提供问题的屏幕截图以及您希望最终解决方案的外观？
@Tokant 谢谢，我提供了图形文档来支持我的问题。
嗨，大卫。在您的屏幕截图中，只有 3 个菜单项可见，但您有一个名为 INICIO 的第 4 个菜单项。您是否也想显示一个，即所有 4 个列表项在一行上可见而不滚动？
@Tokant 没错。虽然我不确定这是否是我的问题的根源。
这不是您的问题的根源，而是进一步澄清了问题所在（您的绿框也应该向左延伸）。

【解决方案1】：

锚链接中的文本（INICIO、NOSOTROS 等）破坏了布局。所以将 font-size 设置为较小的值，例如 10px：

.ast-header-break-point .main-navigation li {
    width: 100%;
    font-size: 10px;
}

【讨论】：