title: Bootstrap Carousel in Foreach Loop
body: <p>I have Carousel with 4 images like given in the following image.</p>
  
  <p><a href="https://i.stack.imgur.com/uyMEV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uyMEV.png" alt="enter image description here"></a></p>
  
  <p>My Effort is given in following.</p>
  
  <pre><code>&lt;div id="thumbCarousel" class="carousel slide"&gt;
      &lt;div class="carousel-inner"&gt;
          &lt;?php $i=0; foreach($this-&gt;partner_images as $sr){?&gt;
               &lt;?php if($i==0){ ?&gt;&lt;div class="item active"&gt;&lt;?php } ?&gt;
                   &lt;?php if($i ==4){ ?&gt;&lt;div class="item"&gt;&lt;?php }?&gt;
                        &lt;div class="col-xs-3"&gt;
                              &lt;a href="&lt;?php echo $sr['url']; ?&gt;"&gt;
     &lt;img src="&lt;?php echo BASE_URL?&gt;/partner-images/&lt;?php echo $sr['name']?&gt;" /&gt;
                              &lt;/a&gt;
                        &lt;/div&gt;
                              &lt;?php if($i==3 or $i==7){ ?&gt;&lt;/div&gt;&lt;?php }?&gt;
                            &lt;?php $i++; } ?&gt;
                       &lt;/div&gt;
                      &lt;a class="thumbleft" href="#thumbCarousel" data-slide="prev"&gt;&lt;span class="glyphicon glyphicon-chevron-left"&gt;&lt;/span&gt;&lt;/a&gt;
                      &lt;a class="thumbright" href="#thumbCarousel" data-slide="next"&gt;&lt;span class="glyphicon glyphicon-chevron-right"&gt;&lt;/span&gt; &lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Problem:</strong></p>
  
  <p>The problem is that it is working fine for 4 images and for 8 images, so when there are 4 or more picture are not showing properly. I want to do it automatically either images are even or odd.</p>
  
  <p><strong>Question:</strong>
  My question is how i can show 4 or more images like shown in the images automatically ?</p>