Why slides out?

Question

css

In general, I made a slider, everything is fine until some expansion, and then there are such bugs. Even if you limit the display of elements to 1, on a mobile phone it’s all the same later. How to fix?

photo

Code in the sandbox

Answer 1

I got confused, downloaded and opened and launched at home.
Everything works as it should. You have centerMode: true, even in the demos on the slick site it looks like this in this mode. halves around the edges.
Also, you don't have a viewport meta tag like this:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

And you also need to connect your styles and scripts after the library ones.
And why do you need to connect the slider scripts twice?
It would also be nice to wrap the initialization of the slider in document.ready
. Here I googled a couple of solutions:
https://github.com/kenwheeler/slick/issues/1527
https://stackoverflow.com/questions/36172489/slick...
I tried on one on a couple of my projects, on a slick there is also such a thing, but with Swiper it seems to be normal. Try Swiper Slider