Angular-animate with height: auto; doesn't work [duplicate]

Question

I want to make animation using angular-animate. My css rules is:

.expanded {
    transition: all ease 0.5s;
    overflow: hidden;
}
.expanded.ng-hide {
    height: 0px;
}

If I add, for example, height: 100px to .expanded class, then everything works fine. But how to make it works without height definition? I need this, because the content of .expanded container might be different.

Answer 1

use * as auto,

example :

state('in', style({
        overflow: 'hidden',
        height: '*',
        width: '300px'
      })),