flex 布局 超出后上部子元素无法完全显示

flex布局可很容易实现内部元素的垂直水平居中。遇到一个问题，即子元素的高度超出flex父元素之后，顶部的子元素无法完全显示出来，而底部可以。
如图：上部的叉叉按钮和卡片的头部已经跑到了屏幕的上方，被遮盖住，滑不下来。

屏幕快照 2019-11-04 下午3.53.29.png

正常的应该是：

屏幕快照 2019-11-04 下午3.54.45.png

解决方法：

设置子元素的 margin: auto 。