Html 故意使两个柔性容器在相同的确切特定位置重叠

我需要使“flex container>div4”垂直重叠和/或与“flex container>div2”水平对齐

需要div2和div4完全居中

我使用文本对齐到中间的div2，但div4是一个图像

.flex容器{
显示器：flex；
柔性包装：包装；
背景颜色：蓝色；
}
.flex容器>div{
背景色：#ffffff；
页边顶部：自动；
右边距：自动；
弹性收缩：0；
高度：35px；
最小宽度：150px；
最大宽度：150px；
文本对齐：左对齐；
线高：50px；
字体大小：30px；
}
.flex容器>div2{
背景色：#ffffff；
弹性收缩：0；
页边顶部：自动；
高度：50px；
宽度：250px；
文本对齐：居中；
线高：50px；
字体大小：12px；
}
.flex容器>第3部分{
页边顶部：自动；
左边距：自动；
宽度：150px；
高度：35px；
文本对齐：居中；
线高：50px；
字体大小：15px；
职位：-网络工具包粘性；
位置：粘性；
排名：0；
自我校准：灵活启动；
背景色：白色；
}
.flex容器>分隔器{
背景色：#ffffff；
宽度：33%；
高度：35px；
保证金：1px；
文本对齐：居中；
线高：50px；
字体大小：12px；
}
.flex容器>第4部分{
左边距：自动；
背景色：#ffffff；
文本对齐：居中；
}

---

像往常一样，在发布问题后，我马上想出了一个解决办法

添加：

.flexcontainer > div4 {
display: block;
margin-left: auto;
margin-right: auto;
}

---

不要给问题添加修复/答案。要么写一个答案，要么删除这个问题