当对子div应用css变换比例时，父div高度不具有动画效果

Question

所以我一直试图让父div自动缩放到组合子div的高度。

使用css方法调整子div的大小

.child{
 transform:scale(1);
 transition: 0.5s cubic-bezier(0.55, 0, 0.1, 1) all;
}

父div确实缩放，但缩放非常突然＆amp; janky。

我附上codepen问题。

当您切换开关时，子div将缩放（0）到缩放（1）但是父div等待一秒然后猛然移动到组合子div的整个高度。

我想使用transform：scale（）的原因是因为 performance is better与过渡高度相比。

Answer 1

溢出

只需在父div中将溢出设置为auto，就像这样

#parent {
    width:1300px
    overflow: auto;  
}