title: ng-if animation angularjs collapse
body: <p>I've got a little issue using the animation in angularjs. I can expand and collapse a div but when i collapse it the content of the div disappear after the container collapse. It should be collapse together instead.. I made a jsfiddle here:</p>
  
  <p><a href="http://jsfiddle.net/7tb4g/119/" rel="nofollow">http://jsfiddle.net/7tb4g/119/</a></p>
  
  <p>the css is very simple:</p>
  
  <pre><code>.animate-if.ng-enter, .animate-if.ng-leave {
      -webkit-transition: 1s linear all;
      -moz-transition: 1s linear all;
      -ms-transition: 1s linear all;
      -o-transition: 1s linear all;
      transition: 1s linear all;
  }
  
   .animate-if.ng-enter {
      max-height: 0;
      opacity: 0;
  }
  
   .animate-if.ng-enter.ng-enter-active {
      max-height: 999px;
      opacity:1;
  }
  
   .animate-if.ng-leave {
      max-height: 999px;
      opacity:1;
  }
  
   .animate-if.ng-leave.ng-leave-active {
      max-height: 0;
      opacity:1;
  }
  </code></pre>
  
  <p>thanks</p>