Как правильно стилизовать dots в Slick Slider?

Question

[Shine_97]

Есть вот такой дизайн точек в слайдере

у которых по дизайну у активной точки - width: 8px и height: 8px, у второй - width: 6px и height: 6px, а у третьей - width: 4px и height: 4px, но никак не получается сделать размер точек именно таким.

Как это исправить и реализовать именно такой вид точек? Вот ссылка на CodePen с тем, что у меня получилось.

Answer 1

[Дмитрий]

.slick-dots button {
font-size:0;
padding:0;
}
.slick-dots li:nth-child(1) button {
width:8px;
height:8px;
}
.slick-dots li:nth-child(2) button {
width:6px;
height:6px;
}
.slick-dots li:nth-child(3) button {
width:4px;
height:4px;
}

Comments

[Shine_97]

Спасибо большое! Никак не мог найти это решение. Удачи и успехов Вам! :)