元素定位-引用更高的组件

Question

我有一些具有以下类似结构的Angular应用程序，并且我知道，是否可以使用CSS将divWhichShouldBeInCenterOf-appMainComponent定位在appMainComponent的中心（在文章的结尾）？

appMainComponent
|
 -- internalComponent
    |
    --div
       |
       --component
        |
        --divWhichShouldBeInCenterOf-appMainComponent

CSS

position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);

Answer 1

position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);

此CSS将元素居中，并将其从页面流中删除。 它将位于最接近的父对象的中心

这意味着，如果divWhichShouldBeInCenterOf-appMainComponent和appMainComponent之间的任何元素的位置不是静态的，它将用作参考的中心。