how add spaces between owl carousel item

Question

How can i add space between owl item. add margin or padding between items. this is need to be responsive.can i add some gutter in to the jquery.

function newsCarousel(){
    $("#carousel").owlCarousel({
        items : 4,
        itemsCustom : false,
        itemsDesktop : [1199,4],
        itemsDesktopSmall : [980,2],
        itemsTablet: [768,1],
        itemsTabletSmall: false,
        itemsMobile : [479,1],
        singleItem : false,
        itemsScaleUp : false,
        mouseDrag   :   true,

        //Basic Speeds
        slideSpeed : 200,
        paginationSpeed : 800,
        rewindSpeed : 1000,

        //Autoplay
        autoPlay : true,
        stopOnHover : false,

         //Auto height
        autoHeight : true,
    });
}

Answer 1

Just use margin like this:

function newsCarousel(){
    $("#carousel").owlCarousel({
        items : 4,
        margin: 20,
        autoHeight : true,
    });
}

Answer 2

create a class for margin/padding and use it as per your requirement.

.margin_10 { margin:10px }

</style>




<div id="carousel2"
<div class="carousel-inner">

<div class="item margin_10">

<!--your pic + content will go here as per requirement-->


 </div> 

</div>
</div>