html - 画布超出网格布局

Question

我正在尝试创建一个包含 3 个内容列和一个.overlay包含particles.js画布的div 的网格布局。

这是我正在努力的代码笔：https ://codepen.io/radzak/pen/MVQVPQ

我希望网格始终是屏幕的 100%，所以我设置了这个

.container {
  height: 100vh;
  width: 100vw;
}

问题是，在我扩展窗口大小然后再次减小它之后，画布继续占用它以前的空间（而不是 100vw x 100vh）。我还注意到画布width与height它所占据的实际大小不符。

我不知道发生了什么，任何有关如何设置此布局的帮助将不胜感激。

Answer 1

尝试设置position: absolute以canvas将其从文档流中删除。