如何修复仅在移动设备上显示的未知右边距？

Question

我创建了一个在桌面上可以正常运行的网站，但是由于某种原因，它在右侧显示了一个空白，这是完全出乎意料的。试图模仿他人在StackOverflow上的解决方案，但仍然看不到任何区别。请帮忙！

我尝试去掉了填充物，边距和左/右位置，但是我仍然无法移动它一英寸。 ：（

网站：http://tobyio.com
代码：https://github.com/Soundpulse/soundpulse.github.io

图片显示了现在的样子：
https://imgur.com/a/s4HeuWH

Answer 1

我删除了本节

<section id="showcase">
<section id="resume">

它起作用了，可能是您在某个地方有固定的宽度或o位置问题。 -正如@threeFatCat所说，您可以对两个部分都使用overflow：hidden

Answer 2

由于公司政策，我无法查看您的图片，因为我们的浏览器中没有共享图像。但是，如果您要谈论水平显示的滚动条，请基于链接。将此添加到您的<section id="resume">：

overflow:hidden;

看起来它解决了问题，我正在使用开发工具，但是最好在这里粘贴您的简短代码。先尝试一下。

修改 如果万一overflow:hidden;给您其他设计中的设计问题（我没有检查过）。最好将css与Media queries一起应用。

Answer 3

尝试一下，它将为您提供帮助：

section:not(#sidebar) {
 margin-left: auto;
 width: calc((100% - 15%) - 20px);
} 
.container {
 overflow: hidden;
}