• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 399
  • Last Modified:

Need help with owl-carousel on Bootstrap

Hi, looking at this test site: mostlydesserts.com/responsive/

The carousel at the top is good with the three images. I'd like to add a fourth,  but this doesn't work, how can I make that work, please?:

<!-- CAROUSEL -->
      <div id="carousel">  
        <div id="owl-demo" class="owl-carousel owl-theme">
            <div class="item">
              <img src="img/chocolate-cake2.jpg" alt="Chocolate Cake delivered">
              <div class="line">
                  <h2>tempting cakes... </h2>
              </div>
            </div>
            <div class="item">
              <img src="img/dutch-apple-pie2.jpg" alt="Dutch Apple Pie delivered">
              <div class="line">
                  <h2>phenomenal pies...</h2>
              </div>
            </div>
            <div class="item">
              <img src="img/tiramisu2.jpg" alt="Tiramisu Delivered">
              <div class="line">
                  <h2>puddings & such...</h2>
              </div>
                <div class="item">
              <img src="img/lemon-tarte2.jpg" alt="Lemon Tarte">
              <div class="line">
                  <h2>other delectables...</h2>
              </div>
            </div>
        </div>
      </div>
0
mel200
Asked:
mel200
  • 2
1 Solution
 
GaryCommented:
You should just need to add the fourth slide. There's no magic to it.
What happens when you do add it?
0
 
mel200Author Commented:
Darn, I missed a div when I did it before, I had:

<!-- CAROUSEL -->
      <div id="carousel">  
        <div id="owl-demo" class="owl-carousel owl-theme">
            <div class="item">
              <img src="img/chocolate-cake2.jpg" alt="Chocolate Cake delivered">
              <div class="line">
                  <h2>tempting cakes... </h2>
              </div>
            </div>
            <div class="item">
              <img src="img/dutch-apple-pie2.jpg" alt="Dutch Apple Pie delivered">
              <div class="line">
                  <h2>phenomenal pies...</h2>
              </div>
            </div>
            <div class="item">
              <img src="img/tiramisu2.jpg" alt="Tiramisu Delivered">
              <div class="line">
                  <h2>puddings & such...</h2>
              </div>
            </div>
        <div class="item">
              <img src="img/lemon-tarte2.jpg" alt="Lemon tarte Delivered">
              <div class="line">
                  <h2>other delectables...</h2>
            </div>
        </div>
      </div>
0
 
mel200Author Commented:
You're right, I just made a mistake. Thanks!
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now