center thumbs in splidejs image gallery

Question

I am working on a Thumbnail Slider like here:

https://splidejs.com/tutorials/thumbnail-slider/

on big screens the thumbs are left aligned. I tried to center them.

see https://codepen.io/caplod/pen/ExboPyP

but then the first one gets cut off on small screens.

#thumb .splide__list {
  justify-content: center
}

how can I fix this?

Answer 1

Puedes agregar un contenedor a splide, funciono para mi

#container{
  display         : flex;
  justify-content : center;
}

Answer 2

Add code align-items:center;

#thumb .splide__list {
    justify-content: center;
    align-items:center;
}