Javascript 推入式菜单上的大神秘边距

我已经实现了一个“推式菜单”移动菜单到一个非常基本的网站结构。 菜单基于

出于某种奇怪的原因，当我点击“右键”按钮时，菜单的右边有一个很大的空白。我不知道为什么会发生这种情况，也不知道如何解决。它在IE11中运行良好，但在Chrome v52中则不行

以下是问题的一个示例：

我已经尝试使用DevTools来精确定位任何可能导致问题的CSS或标记，但没有任何运气

这是什么原因造成的？我如何修复它

---

这就是它应该是什么样子，以及它在IE 11中的样子：

这就是问题所在，它在Chrome中是什么样子的：

---

您已经在CSS中将主包装设置为移动-300px，但您只希望菜单移动。删除此

.overlay-wrapper.has-push-right {
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
}

@media all and (min-width:320px) {
  .overlay-wrapper.has-push-right {
      -webkit-transform: translateX(-300px);
      -ms-transform: translateX(-300px);
      transform: translateX(-300px);
  }
}

---

下一次使用JSFIDLE（免费工具）会很好，我使用了你的链接。它确实使回答问题变得非常容易。点击问题的人可以快速查看、解决和测试解决方案，以确保他们确实进行了有效的更正。

您在CSS中将主包装设置为移动-300px，但您只希望菜单移动。删除此

.overlay-wrapper.has-push-right {
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
}

@media all and (min-width:320px) {
  .overlay-wrapper.has-push-right {
      -webkit-transform: translateX(-300px);
      -ms-transform: translateX(-300px);
      transform: translateX(-300px);
  }
}

---

下一次使用JSFIDLE（免费工具）会很好，我使用了你的链接。它确实使回答问题变得非常容易。单击该问题的人可以快速查看、解决和测试解决方案，以确保它们确实进行了有效的纠正。

< P>空区的原因是，您有以下CSS规则（为简洁而省略了前缀变量）：

最后一组规则将菜单放置在容器的“右侧”。第二条规则重置translate，并将其放回容器中。第一个将整个物体向左移动

---

删除第二个，你应该全部设置。

< P>空区的原因是你有以下CSS规则（为简洁而省略了前缀变量）：

最后一组规则将菜单放置在容器的“右侧”。第二条规则重置translate，并将其放回容器中。第一个将整个物体向左移动

---

删除第二个，您应该已经准备好了。

结果，我忘记了

#页面的结束标记。我很尴尬。下次我将彻底检查我的标记
 结果是，我忘记了
#页面
的结束标记。我很尴尬。下次我将彻底检查我的标记
 
这是一个包含所有需要文件的zip文件
-不用麻烦，只有傻瓜才会下载它如果你能用一把简单的小提琴为我们解决问题，而不是所有这些，那就太好了。。在抽象代码（从问题中删除不相关的代码）时，您可能会自己解决这个问题。是的，我试过了。我基本上不知道问题出在哪里我已经经历了很多次了。你有没有试过浏览器的“开发者工具检查器”来检查每个元素的框模型-你应该能够得到各种有用的信息，包括确切的css是如何影响每个元素的哇，StackOverflow现在有点苛刻
这是一个包含所有需要文件的zip文件
-不用麻烦，只有傻瓜才会下载它如果你能用一把简单的小提琴为我们抽象出问题，而不是所有这些，那就太好了。。在抽象代码（从问题中删除不相关的代码）时，您可能会自己解决这个问题。是的，我试过了。我基本上不知道问题出在哪里我已经经历了很多次了。你有没有试过浏览器的“开发者工具检查器”来检查每个元素的框模型-你应该能够得到各种有用的信息，包括确切的css是如何影响每个元素的哇，StackOverflow现在有点苛刻！这是我的错，正如我在问题中应该说的那样，我选择的是推入式菜单，而不是覆盖式菜单类型。但除此之外你是对的：/噢！嗯，让我想想。这是我的错，正如我在问题中应该说的，我选择的是推入式菜单，而不是覆盖式菜单类型。但除此之外你是对的：/噢！嗯，让我想想。