html - 具有绝对位置的 Div 不等同于定位

Question

正如您在下面的屏幕截图中看到的，我的垂直 div 的技能标题(编码、框架、方法)不是定位等价物。

请告诉我哪里出了问题，我的 CSS 知识现在有点生疏了。 :)

.vc {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: left;
}

.skill .title {
    left: -15px;
    padding: 5px 25px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 0;
    transform: rotate(90deg);
}

Answer 1

这可能是由于标题上的转换属性而发生的。默认情况下，变换原点是您正在变换的框的中心。由于文本长度，因此，您的框宽度因标题而异，这导致相对于您的主要内容的不同定位旋转点。

您可能想尝试将变换原点移动到“中左”