Перемещение CSS в Angular parent div height

Question

Я использую переход css, чтобы создать скользящий эффект в моей разбивке на страницы. Проблема в том, что даже когда я устанавливаю позицию перешедших элементов в определенное положение, высота содержащего div все еще изменяется. Мой CSS выглядит следующим образом

.slide { 
    position: relative; 
    display: block; 
} 

.slide.ng-enter, 
.slide.ng-leave 
{ 
    -webkit-transition: 2000ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    -moz-transition: 2000ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    -ms-transition: 2000ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    -o-transition: 2000ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    transition: 2000ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
} 

.slide.ng-enter { 
    left: 100%; 
} 
.slide.ng-enter.slide.ng-enter-active { 
    left: 0; 
} 

.slide.ng-leave { 
    left: 0; 
} 
.slide.ng-leave.slide.ng-leave-active{ 
    left: -100%; 
} 

и мой взгляд

<div class="row slide" ng-repeat="alert in pagedItems[currentPage]"> 
    <div class="col-md-12"> 
     {{alert.attributes.subject}} 
    </div> 
</div> 

вот мой Plunker

Answer 1

Попробуйте использовать позицию: абсолютная при переходе вместо родственника.