title: Create Multiple Rows Carousel From Owl Carousel
body: <p>I am trying to insert an owl carousel in my web page. which contains the carousel items in multiple rows .</p>
  
  <p>Right Now My Carousel Looks Something like this.</p>
  
  <p><a href="https://i.stack.imgur.com/enWsv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/enWsv.png" alt="enter image description here"></a></p>
  
  <p>What I want to have is two more rwos inside it then the next &amp; prev buttons. I tried the Following Code, ut its not working.</p>
  
  <p>Here is My Code :</p>
  
  <p><strong>HTML :</strong> </p>
  
  <pre><code>&lt;div class="owl-carousel owl-theme"&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
    &lt;div&gt;&lt;img class="client_image" src="assets/img/banner/download.png" alt="Owl Image"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Her is My <strong>Javascript :</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(".owl-carousel").owlCarousel({
      nav: true,
    dots: false,
    loop: false,
    rewind: true,
    // autoWidth: true,
    stagePadding: 0,
    margin: 4,
    checkVisibility: true,
    navElement: 'div',
    responsive : {
      0 : {
        items: 4,
        slideBy: 4
      },
      768 : {
        items: 2,
        slideBy: 2
      },
      1024 : {
        items: 3,
        slideBy: 3
      },
      1280 : {
        items: 4,
        slideBy: 4
      },
      1440 : {
        items: 5,
        slideBy: 4
      }
    }
  });
  &lt;/script&gt;
  </code></pre>