Bootstrap 4 Multiple Items Carousel (several carousel items shown at once)

You can display one carousel item at a time, but fill it with multiple elements. Something like:

.item
  .col-xs-4
     {content}
  .col-xs-4
     {content}
  .col-xs-4
     {content}

But you may then be wishing you could advance them one at a time. That isn't going to happen with bootstrap right out of the box. After implementing many carousels, I'd recommend seeking another carousel library when Bootstrap's doesn't fit the bill. Slick.js is my go-to lib for lots of carousel config options. And its a fairly slim ~5k min'd and gzipped.

If you're hard-set on using bootstrap, here is a script that can provide single advance, multi-items: http://codepen.io/MarkitDigital/pen/ZpEByz

2019 Update for Bootstrap 4

I have done this using the Bootstrap 4 grid with separate columns for each carousel item. If you want to advance only one item at a time, the script can be something like this that clones the slides into each carousel item..

(function($) {
    "use strict";

    $('.carousel .carousel-item').each(function(){
      var next = $(this).next();
      if (!next.length) {
        next = $(this).siblings(':first');
      }
      next.children(':first-child').clone().appendTo($(this));

      if (next.next().length>0) {
        next.next().children(':first-child').clone().appendTo($(this));
      }
      else {
        $(this).siblings(':first').children(':first-child').clone().appendTo($(this));
      }
    });

})(jQuery); 

Mulitple items:
http://codeply.com/go/WEbiqQvGhy

Mulitple items, move one at a time:
http://codeply.com/go/FrzoIEKCdH (Bootstrap 4 alpha)
http://codeply.com/go/3EQkUOhhZz (Bootstrap 4.0.0)

Responsive 3 items on large (1 at a time), 1 item on smaller:
http://codeply.com/go/s3I9ivCBYH

---

Also see: https://stackoverflow.com/a/20008623/171456