How can I make the width of the items always be the same regardless of the number?

Question

css

I scroll (via touch) - the slides change
, but in the last row the width gets lost (if there are not enough elements for the number of 3 in a row)

, you can of course add empty divs through the markup
, but maybe there is a better option?

https://jsfiddle.net/jtw8fk60/1/

Answer 1

In order for the slider to work normally, you do not need to redo the slides, you need to insert your own blocks inside the slides and twist them there as you like. But if you really need to hang crutches, then indentations must be taken into account in size:

.clients__box {
  outline: 1px solid red;
  margin: 0 40px;
  margin-bottom: 20px;
  width: calc(100% / 3 - 80px) !important;
}