主 <html> 元素右侧的有趣间隙

Question

上使用 Foundation css，并进行了调整

由于某种原因，元素右侧有一个有趣的空隙。我不确定问题是什么，并且在过去一周内一直在断断续续地寻找解决方案。任何帮助都会很棒。祝一切顺利。我已经尽力解释了！

显示错误的屏幕截图：

Answer 1

paddingStepOne 有问题class

删除所有左右边距并检查一次（所有媒体查询）

.paddingStepOne {
   margin: xxrem auto;
}

Answer 2

你需要看看这个css:

@media screen and (min-width: 500px)
main.scss:331
.paddingStepOne {
  margin: 2rem 3.5rem;
}

您在此处添加的 margin 导致元素超出计划标题上的 100%。

在这种情况下，我临时添加以下内容CSS：

* {
  border:1px solid red !important;
}

这会让您看到哪些元素导致 100% 宽度受到影响。

Answer 3

我在您的 CSS 中找到了解决方案。您可以调整此更改，然后可以删除该间隙或栏。 Image of the class in which you have to do some changes.

在 .cell class 中，您必须删除这些选项

-webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;

我进行了这些更改，html 元素右侧的 space 问题已解决。我正在发布您网站更改后的图片。

Image after changes

希望对您有所帮助。祝一切顺利。

Funny gap to right of main <html> element