Multi slide bootstrap carousel issue

jquery
bootstrap

#1

Based upon this demo (after having tried several others) I create a multi slide bootstrap carousel. It still doesn’t behave properly, I don’t know why several rows are coming up and why it stops after a while. Seeit here I spent hours on this :frowning:


#2

Right. let’s start with “Why does it stop after a while”.

Some of your items have already got the ‘active’ class set when the page loads. The carousel stops when it hits one of these items.

In fact, it happens every 4th item.

I assume (based on this being an ASP page), that you’re generating the page using some ASP code. Check your code to make sure you’re ONLY setting the class “active” to the FIRST element generated, not every fourth.

When i manually corrected this problem, the carousel displayed and worked correctly.


#3

Thanks, indeed I had an issue with the settings fo the ‘active’ class which I solved.

Now my issue is that the slide should show 3 items, fine, but when it is scrolling the 4th item is shown and push the contents down.


#4

So I came up with a solution for this, though dont ask me to explain how or why. One of our CSS gurus can probably do better with that than me.

Override the CSS on the carousel-inner element to specify flex-wrap: nowrap.


#5

Working like a charm ! A real guru you’ve got there ! Thanks