Css 如何将一个固定的div置于另一个div的中心？

我正在尝试将一个

div

（

叠加

）置于另一个div的中心。我已经设法将它集中在

div

中。但是，当父对象的内容被滚动时，它将被切断，而不会粘在中心。不幸的是，

覆盖

不能仅设置为固定：

以下是我目前的代码：

.parent{
位置：相对位置；
高度：50px；
宽度：200px；
边框：1px纯蓝色；
空白：nowrap；
溢出：滚动；
}
.覆盖{
位置：绝对位置；
保证金：自动；
排名：0；
左：0；
底部：0；
右：0；
高度：100px；
宽度：100px；
背景色：红色；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。

您可以使用flexbox进行此操作。此外，您还必须添加将占用内容宽度和高度的包装器，并将文本移动到某个标记（即

span

）：

.parent{
高度：50px；
最大宽度：200px；
边框：1px纯蓝色；
空白：nowrap；
溢出：滚动；
}
.flex{
位置：相对位置；
显示：内嵌flex；/*宽度配合内容*/
最小宽度：100%；/*不小于父级宽度*/
最小高度：100%；/*不小于家长的高度*/
对齐内容：居中；/*水平居中项目*/
对齐项目：居中；/*垂直居中项目*/
}
.覆盖{
位置：绝对位置；
高度：100px；
宽度：100px；
背景色：红色；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。

找到了一种方法来得到我想要的东西。但是，我认为它是非理想的，因为它需要附加的<代码>包装器< /C>元素>

.parent{
位置：相对位置；
高度：50px；
宽度：200px；
边框：1px纯蓝色；
空白：nowrap；
溢出：滚动；
}
.包装纸{
位置：相对位置；
显示：内联块；
边框：1px纯红；
}
.覆盖{
位置：绝对位置；
保证金：自动；
排名：0；
左：0；
底部：0；
右：0；
高度：100px；
宽度：100px；
背景色：红色；
z指数：100；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。

谢谢。我从未使用过flexbox。然而，它似乎不起作用。覆盖层（1）在水平滚动时仍然不粘滞，（2）被切断。家长的文本内容也有不同的垂直排列。不，这似乎是一个误解。我想让它粘在中间。但我评论说，在你的第一个建议中，它没有。