我正在构建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
答案 0 :(得分:2)
Philip Walton的flexbox解决方法#1就是答案。将这些添加到子flex元素工作:
flex-shrink: 0;
flex-basis: auto;
https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored