Html 两个div之间的化身图像

我只是想知道是否有一个更优雅的解决方案来实现以下目标

我试图在两个分区的垂直中间放置一个化身图像，如下所示： 是否有一个引导css类来实现这一点，这样我就不必自己添加这些内容了？

所需的一切：

<div class="roundedCenter">
    <div></div>
</div>

.行{高度：150px；} .roundedCenter>div{ /*更改：*/ 宽度：160px；高度：160px； /*不要改变：*/ 位置：绝对位置； 转换：translate3d-50%，-50%，0； 左：50%； 背景：fff； 盒影：0 5px 7px rgba0,0,0.1； 边界半径：50%； }

---

显示你的代码！我不想找它！没什么大不了的。它是一个绝对元素，左50%，左半减去边距。你自己做。你检查过元素了吗，看看它应用了什么风格？我已经完成了，我只是想知道是否有一个引导的唯一方法；很高兴看到我的问题被无缘无故地否决：谢谢，这是我的方式：似乎没有引导方式

.roundedCenter > div{
  /*Change or remove and set as a separate class:  */
  width:160px; height:160px;

  /*Don't change:  */
  position: absolute;
  transform: translate3d(-50%, -50%, 0);
  left:50%;
  background:#fff;
  box-shadow: 0 5px 7px rgba(0,0,0,0.1);
  border-radius:50%;
}