скролю (через тач) - слайды меняются но в последнем ряде сбивается ширина ( если не хватает элементов для количества по 3 в ряд)
можно конечно через разметку добавить пустые дивы но может есть вариант получше?
let clients_slider = $('.clients__holder');
clients_slider.slick({
slidesPerRow: 3,
rows: 3,
slidesToScroll: 1,
dots: false,
arrows: true,
appendArrows: $('.clients__arrows'),
prevArrow: '<button class="clients__arrow clients__arrow--dir_left"></div>',
nextArrow: '<button class="clients__arrow clients__arrow--dir_right"></button>',
responsive: [{
breakpoint: 460,
settings: {
slidesPerRow: 2,
rows: 4
}
}
]
});
.clients__box {
outline: 1px solid red;
margin: 0 40px;
margin-bottom: 20px;
}
.clients__holder {
margin: 0 -40px;
}
.slick-slide>div {
display: flex;
align-items: center;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css" rel="stylesheet"/>
<div class="clients__holder">
<div class="clients__box">
1
</div>
<div class="clients__box">
2
</div>
<div class="clients__box">
3
</div>
<div class="clients__box">
4
</div>
<div class="clients__box">
5
</div>
<div class="clients__box">
6
</div>
<div class="clients__box">
7
</div>
<div class="clients__box">
8
</div>
<div class="clients__box">
9
</div>
<div class="clients__box">
10
</div>
<div class="clients__box">
11
</div>
<div class="clients__box">
12
</div>
<div class="clients__box">
13
</div>
</div>
<!--end clients__holder-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.js"></script>