移动页面加载处于“缩放”状态

Question

我在尝试提高我的投资组合在移动设备上的响应速度时遇到问题。发生的事情是在初始负载下，页面以“放大”状态显示。我可以缩小并查看该网站的样子。导航栏似乎占据了适当的宽度，但是下面的所有元素明显都更宽了，没有我真正能找到的原因。

当前代码是https://codespent.dev上最新的代码，以供检查，因此我不会用代码弄乱这个问题，我将在解决问题时添加相关代码。

我尝试过的事情：

试图将视口元数据添加到restrict scaling & set the initial scale。

<meta name="viewport" content="width=device-width; initial-scale=1.0; user-scalabe=0;">

据我所知，已确认元素上没有静态宽度。

确认reported device-width is accurate，但元素仍然超出宽度。

发现：

图表中的画布导致忽略设置高度和宽度的responsive: true;导致文档宽度过大。

• 通过在max-width: 250px上设置canvas来解决此问题，以防止扩展错误读取设备宽度。

溢出的打字机代码字符串导致宽度扩大。

Answer 1

图形中的canvas元素的固定宽度为2000px。