Search code examples
twitter-bootstraptwitter-bootstrap-3cycle2

Cycle2 Carousel and Bootstrap bug


I have done a plunker so you can see my problem...

Setting the col-xs-12 and col-md-3 (using bootstrap auto-width capabilities) it destroy the cycle2 making the slides get a massive width.


Solution

  • Add to your slider:

    data-cycle-carousel-fluid="true"<br>
    data-cycle-carousel-visible="X"<br>
    

    (X being the amount of visible elements)

    Cycle overwrite the width of the element and calculate itself the appropriate one. But the numbers are rounded up so you might need to add a "margin-left:-1px" to the elements in the carousel.