css3 转换：切换 css 类不会转换顶部/左侧/底部/右侧（由于添加了 :before 或 :after 元素）[重复]答案

【问题标题】：css3 transitions: toggling css class doesn't transition top/left/bottom/right (due to :before or :after elements being added) [duplicate]css3 转换：切换 css 类不会转换顶部/左侧/底部/右侧（由于添加了 :before 或 :after 元素）[重复]
【发布时间】：2019-04-30 22:13:35
【问题描述】：

我无法使用这个 css 在 div 上转换上/左/下/右：

 .question-part-1 {
        width: 260px;
        height: calc(100vh - 90px);
        position: absolute;
        background-color: #000891;
        box-shadow: 0 0 20px rgba(0,0,0,0.75);
        padding: 35px;
        z-index: 2;

        transition: all 300ms ease-in-out;

        &.disabled {
            background-color: #000891;
            height: calc(100vh - 130px);
            left: -70px;
            top: 40px;
            z-index: 1;

            h2, .option {
                opacity: 0.5;
            }
        }
    }

我正在用 jquery $('.question-part-1').toggleClass('disabled') 切换禁用类

【问题讨论】：

FTR 我正在使用 jquery 3 更改课程
分享完整代码以便我们查看问题
不相关，有几百行不相关，有一行在切换类

标签： css css-transitions

【解决方案1】：

如果元素没有相应的初始上/左/下/右值，则不能在具有绝对位置的元素上转换上/左/下/右值。

要解决上述问题，只需将top: 0px 和left: 0px 添加到基类.question-part-1

【讨论】：