display flex 不工作并且不可能居中 div

display flex does't work and impossible to centered the div

这是我的测试 https://jsfiddle.net/Artenis/nozv1nsf/#&togetherjs=yjibGnfDFM

你能告诉我我的错误在哪里吗

我希望包含文本(黑色不透明度)的 div 相对于背景图像水平和垂直居中。 div 背景颜色为黑色不透明度不会占用总高度,而只会占用文本 div 的填充。 同样的 div 必须占据背景的所有宽度。 我用

display:flex; justify-content:center; and content-align:center;

到目前为止它一直有效,但在这里不行。

这应该可以解决您的问题。

.moncontenu{  color: rgb(255, 255, 255); text-shadow: 2px 4px 2px rgb(0, 0, 0); font-size: 33pt;width:100%; padding: 15px 0px !important; align-self: center;}

(已添加 align-self: center;