Javascript 初始页面加载时，在响应平板电脑模式下导航出现问题

我有一个导航，其中桌面上显示的普通链接缩小为一个按钮，单击该按钮时将下拉导航链接。。相当标准。我遇到的问题是，当页面最初以平板电脑大小（767px-991px之间）加载时，页面会缩小到右侧。如果加载到任何其他媒体查询大小，它工作正常

以上就是问题所在。。。明显地下面是这应该是什么样子。

---

我已尝试在inspector tools移动区域中重新创建，但无法在那里重现该问题。它确实发生在firefox、chrome和safari中。该网站位于。我很高兴在这里发布代码，如果它更合适的话，但是有这么多的代码页面，我想发布网站会更容易。如有任何反馈，我们将不胜感激。谢谢大家!

只需设置

宽度：自动或
宽度：适合内容在main中，而不是100%

@media (max-width: 991px)
#header .header-nav-main{
  width: auto;
}

或

@media (max-width: 991px)
  #header .header-nav-main{
    width: fit-content;
}