html - 响应能力完全被破坏+整个身体的边缘无法识别？

我已经链接了我的 github 和我的网站。我正在尝试建立我的投资组合网站，所以它仍处于早期阶段。

我已经构建了大部分桌面视图，现在我正在尝试构建移动站点。但是，当我缩小网站时，该网站在移动设备上完全中断。

在移动视图中，右侧的整个页面似乎有一个全局边距，我无法弄清楚它是什么，有人可以帮忙吗？

标签： htmlcssresponsive-design

在页面下方，您会看到这个电子邮件地址以非常大的字体大小写成：

<a class="email" href="mailto:donniejrberry@gmail.com">donniejrberry@gmail.com</a>

由于邮件地址不包含空格，所以它保留在一行中，但是由于您使用了相当大的字体大小，所以它比body！这会强制您的整个页面与邮件地址一样宽，因此会生成一个水平滚动条，因为它比视口更宽。

font-size解决方案：在移动版本中为该行使用较小的值。

对于其他看起来不太好看的东西，也可以为许多元素使用媒体查询和较小的字体大小。