Css 如何使用transform-translate属性将元素移动到具有溢出的div之外？

我想用CSS属性transform translate将一个元素移动到一个具有溢出的div之外

如何才能得到与“无溢出”示例相同的结果

位置：固定

.main{
显示器：flex；
柔性流动：柱状nowrap；
证明内容：周围的空间；
高度：80vh；
}
.家长{
背景：#000；
宽度：10雷姆；
身高：5雷姆；
}
.孩子{
背景：#ccc；
宽度：5雷姆；
高度：3雷姆；
转换：转换（6rem，3rem）；
}
.儿童固定{
位置：固定；
}
.溢出{
溢出：自动；
}

无溢出

溢出

具有溢出和固定

尝试以下代码片段：

CSS:

HTML:

---

尝试以下代码片段：

CSS:

HTML:

您想要的结果是什么？比如在“溢出并修复”的示例中，我希望子对象超出父div，而不是放大并卡在父div中。您想要的结果是什么？比如在“溢出并修复”的示例中，我希望孩子在父div之外，而不是放大并被卡在其中问题是div父级必须有溢出，我放了第一个示例来显示我需要的结果看起来像什么问题是div父级必须有溢出，我放了第一个示例来显示我需要的结果看起来像什么

.parent {
    background: #000;
    width: 10rem;
    height: 5rem;
}

.overflow {
    overflow: auto;
}

.child {
    background: #ccc;
    width: 5rem;
    height: 3rem;
    transform: translate(6rem, 3rem);
}

<div class="parent overflow">
    <div class="child"></div>
    </div>
</div>