html设置div顶格,中心覆盖中间格的内容在底部的顶格和顶部的底部DIV竖放

比方说，我有3个div元素，包裹在文章元素。这将是这个样子：中心覆盖中间格的内容在底部的顶格和顶部的底部DIV竖放

This is some content!

现在，想什么，我对的是有类“阿凡达”，中等(重叠)的“拇指”和“内容” div之间出现垂直和水平居中。

正如你所看到的，我与WordPress的工作。具体来说，为Divi主题创建一个自定义模块。

我到目前为止(这工作得很好，但反应不是100％ - 作为，化身并不总是重叠的2点其他分区的之间居中)的CSS是这样的：

.avatar {

margin-left: auto;

margin-right: auto;

max-width: 25%;

min-width: 70px;

position: relative;

}

.avatar img {

border-radius: 50%;

background-color: rgba(255,255,255,.2);

padding: 5px;

margin-top: -60%;

z-index: 10;

}

这里是小提琴如果有帮助：poor attempt

高兴，如果需要提供更多的信息。我只是确定如何为搜索引擎“或者”在这里“说出”这个词。谢谢！ :)