title: Swiper.js vertical slides not working using ngx-swiper-wrapper
body: <p>I have two stackblitz examples, the first with horizontal slides and then I change them to vertical slides.
  When I make this change, the height gets blown up to something very large.</p>
  <p>Any help understanding this?</p>
  <p>Here is the stackblitz link that works with horizontal slides <a href="https://stackblitz.com/edit/angular-ivy-2vfx7d?file=src%2Fapp%2Fapp.component.ts" rel="nofollow noreferrer">link</a> - working</p>
  <p>Here is the stackblitz link with vertical slides <a href="https://stackblitz.com/edit/angular-ivy-emz7sk?file=src%2Fapp%2Fapp.component.ts" rel="nofollow noreferrer">link</a> - css alignment is off</p>
  <p>The only difference is I've changed</p>
  <blockquote>
  <p>direction: 'horizontal',</p>
  </blockquote>
  <p>to</p>
  <blockquote>
  <p>direction: 'vertical',</p>
  </blockquote>
  <p>in the config here</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>config: SwiperConfigInterface = {
      observer: true,
      observeParents: true,
      observeSlideChildren: true,
      direction: 'vertical',
      threshold: 50,
      spaceBetween: 0,
      slidesPerView: 1,
      centeredSlides: true,
      slideToClickedSlide: true,
      pagination: this.pagination,
    };</code></pre>
  </div>
  </div>
  </p>