Css 相对于其他div定位div

我有一个设计问题，我不知道如何处理

我有3个并排的div，中间的一个将有5个子div，它们将在相邻div（div1和div2）周围偏移放置，一些在侧面，一些在下面

最初，我将中心div（蓝色虚线）定位为相对，其子div绝对定位，并与top、right、left和bottom一起放置

我不确定这是一个理想的方法，尤其是如果我想能够增强移动布局

我尝试按如下方式手动定位元素，但它似乎非常麻烦：

<div class="col col-2">
    <div class="items">
        <div class="item item-1">1</div>
    </div>
</div>

.col { position:relative; }
.item { width:55px;height:55px; position:absolute; }
.item.item-1 { top:0; left:0; }

1.
.col{位置：相对；}
.项目{宽度：55px；高度：55px；位置：绝对；}
.item.item-1{顶部：0；左侧：0；}

完整示例如下：

我很想了解这一点

谢谢， 美国

---

向我们展示您已经拥有的内容。请发布您拥有的html/css。这种方法不错，或者至少我会尝试这样做。这还取决于您希望/需要如何在特定的视口中显示内容。如果不使用绝对定位，就很难对元素进行那样的布局。对于移动/小屏幕，您可以使用媒体查询使其完美工作，因此需要第二种方法。处理此类布局的方法有很多，但使用浮动包含元素和相对定位。