Html Microsoft Edge处理视口高度与其他浏览器不同

JSFiddle：

我看到了一个问题，上面提到的，在Chrome和Edge之间

在Chrome中，一切都很好，工作正常。请注意，页脚始终显示，左侧div不会滚动

在边缘，没有那么多。页脚位于页面底部。高度被视为一直到底部，而不是剪切到视口高度

似乎是视口造成的，但我找不到任何已知问题的参考

  height: 100vh;
  width: 100vw;

有什么解决办法吗

谢谢

所以，我找到了这个博客：

并得出了这个解决方案：

键是主div下的最小高度：0

.main {
  display:flex;
  flex-direction: row;
  flex-wrap: nowrap;
  flex: 1 1 auto;
  min-height: 0;
}