简体   繁体   English

在 splidejs 图片库中居中拇指

[英]center thumbs in splidejs image gallery

I am working on a Thumbnail Slider like here:我正在处理缩略图 Slider,如下所示:

https://splidejs.com/tutorials/thumbnail-slider/ 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参见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?我怎样才能解决这个问题?

Puedes agregar un contenedor a splide, funciono para mi Puedes agregar un contenedor a splide, funciono para mi

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

Add code align-items:center;添加代码 align-items:center;

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM