科技微讯

使用 margin:auto 居中 flex 元素

在一个使用了 align-items: center; justify-content: center; 的 flex container 中,如果子元素的高度或宽度大于 container 的高度或宽度,子元素可能会显示不完整,具体问题可以看 stack overflow

解决方法是在 container 删除 align-items: center; justify-content: center;,然后在子元素增加 margin: auto,即由子元素自己居中自己,当然,这样做了之后子元素显示在 container 的那部分就不是它最中间的部分:

暂无评论