Css `ng hide`-动画如何防止在hide上跳转？

我正在尝试使用面板高度的

ng hide

制作手风琴动画。但是当应用

ng hide

时，我发现了一个跳转。（单击第一个标题以显示和隐藏）

有人能帮我解决这个问题吗

以下是我的css代码：

.animate-show{
  border:2px solid gray;
  padding: 10px;
  background:green;
}

.animate-show.ng-hide {
  transition: all linear 0.5s;
}

.animate-show.ng-hide {
  line-height: 0;
  padding: 0;
  height:0;

}

---

您需要删除绿色内容

div

和

.animate show.ng hide

类中后续切换div之间的边距。您可以通过将负

页边距底部设置为此类来执行此操作：

h1{
  background:gray;
  cursor:pointer;
}

.animate-show{
  border:2px solid gray;
  padding: 10px;
  background:green;
  overflow:hidden;
}

.animate-show.ng-hide-add{
  transition: all linear 0.5s;
}

.animate-show.ng-hide-remove
{
  transition: all linear 0.5s;
}


.animate-show.ng-hide {
  line-height: 0;
  padding: 0;
  height:0;
  margin-bottom:-21px;
}

这是一个问题：
您是否忘记将依赖项包含在ng animate中？我同意您的看法。但是那是什么呢？你从哪里计算出来的？那只是为灰框指定的边距。准确地说是21.44px。访问此处后打开控制台：