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

Question

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

我上传了它here这样你就可以看到有什么问题。

Answer 1

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

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

Answer 2

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

.slider img {
      margin: 0 auto;
    }