I'm using slick.js with centerMode: true. Now the issue is ... when I reduce the page width/div width and it's too low, it ends up making two rows. How do I prevent this? I'd have considered using overflow: hidden and hiding the excess because that doesn't really affect how it works, but the buttons also are readjusting and It ends up being placed in the wrong place. how do I fix this?
https://codesandbox.io/s/our-carousel-forked-2tp6g?file=/src/App.js
you can check this to get the issue ... I've just altered an example I found online to recreate the problem. As you bring it closer, you can see the arrows going down because 2 rows are formed.
images:
before ^
after reducing width ^
how do I fix this?