为什么我不能在这个 div 中使用 flex box 使其水平和垂直居中？答案

【问题标题】：Why can't I use flex box in this div to center it both horizontally and vertically?为什么我不能在这个 div 中使用 flex box 使其水平和垂直居中？
【发布时间】：2016-10-10 16:16:29
【问题描述】：

我正在尝试构建一个完全居中的滑块，其中包含不同大小的图像。我使用 flexbox 将滑块的 div 居中，现在我必须将其中的图像居中。我也尝试在那里使用 flexbox，但它似乎对我不起作用。

我把它上传到here，这样你就可以看到哪里出了问题。

【问题讨论】：

标签： html css flexbox positioning

【解决方案1】：

这是因为你的容器太大了。你的容器应该和你的图片一样大，或者你应该把display:flex; justify-content:center; align-items: center;放在包含图片的容器上。

无论哪种方式，您的容器都不能有 100% 的宽度，否则内部将永远不会与中心对齐...

【讨论】：

我尝试在我的网站上将 .slider 的条目垂直和水平居中。我尝试使用 flexbox 来实现它，但它对我不起作用。

【解决方案2】：

只需通过添加以下内容来编辑您的 css 样式：

.slider img {
      margin: 0 auto;
    }

【讨论】：

但我尝试将滑块内的图像垂直和水平居中。