Устранение неисправностей Ионные карты

Question

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

Codepen где карты накладываются друг на друга, вместо укладки по отношению к нижней части предыдущей карты https://codepen.io/Froelund/pen/gppBvX

AngularJS:

angular.module('ionicApp', ['ionic']) 
.controller('MainCtrl', function($scope) {}) 
.directive('flipContainer', function() { 
    return { 
     restrict: 'C', 
     link: function($scope, $elem, $attrs) { 
      $scope.flip = function() { 
       $elem.toggleClass('flip'); 
      } 
     } 
    }; 
}); 

Answer 1

Сделано передней относительны и задней абсолютными и теперь у меня есть желаемый эффект ,

.front { 
    position: relative; 
} 

.back { 
    position: absolue; 
}