title: Swiper carousel slidesPerView doesn't work Properly
body: <p>I have One slide but my slide repeat to three items! How to stop repeat slides? If had 1 slide show one , if is two slide show two, if is 10 slides show 10 :|  this is my config</p>
  
  <pre><code>var swiper = new Swiper('.slides-per-view', {
      pagination: '.swiper-pagination',
      speed: 800,
      loop: true,
      slidesPerView: 3,
      centeredSlides: true,
      spaceBetween: 30,
      grabCursor: true,
      paginationClickable: '.swiper-pagination',
      nextButton: '.swiper-button-next',
      prevButton: '.swiper-button-prev'
  });
  </code></pre>
  
  <p>and this is my Html code </p>
  
  <pre><code>&lt;div class="swiper-container slides-per-view" dir="rtl"&gt;
      &lt;div class="swiper-wrapper"&gt;
          &lt;div class="swiper-slide"&gt;
              &lt;figure&gt;
                  &lt;a href="#"&gt;&lt;img draggable="false" src="assets/pictures/activities/1.jpg" class="img-responsive" alt=""&gt;&lt;/a&gt;
                  &lt;figcaption class="text-light text-center"&gt; Title&lt;/figcaption&gt;
                  &lt;div class="more text-center margin-bottom-30"&gt;
                      &lt;p class="text-blue"&gt;&lt;i class="fa fa-calendar"&gt;&lt;/i&gt; Date&lt;/p&gt;
                      &lt;a href="" class="btn btn-info-border text-dark transition-5"&gt; Read More &lt;/a&gt;
                  &lt;/div&gt;
              &lt;/figure&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="swiper-pagination"&gt;&lt;/div&gt;
      &lt;div class="swiper-button-prev"&gt;&lt;/div&gt;
      &lt;div class="swiper-button-next"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Look at this image please 
  <a href="https://i.stack.imgur.com/EmUHM.jpg" rel="nofollow"><img src="https://i.stack.imgur.com/EmUHM.jpg" alt="enter image description here"></a></p>