Safari Flexbox，可滚动，100vh 问题

Question

我正在构建 100% 高度的应用程序侧边栏，需要滚动并在最底部保留一些链接。我的解决方案在 Chrome 中完美运行，但在 Safari 中存在重叠问题。

基本的部分看起来像这样：

position: fixed;
left: 0;
min-height: 100vh;
height: 100vh;
display: flex;
flex-direction: column;
width: 180px;
justify-content: flex-start;
overflow-y: scroll

在这里查看 Codepen：

http://codepen.io/jackmcdade/pen/PZveXo?editors=1100

任何帮助或见解表示赞赏！我担心这可能是这个Webkit Bug

Answer 1

菲利普·沃尔顿 (Philip Walton) 的弹性盒解决方法 #1 就是答案。将这些添加到子 Flex 元素中是有效的：

flex-shrink: 0;
flex-basis: auto;

https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored