CSS滚动拇指固定圆圈大小

我想把一个滚动条的拇指做成一个固定的圆圈，因为我不能固定高度和大小，所以我缺少了一些东西。现在发生的事情是，根据滚动条的长度，拇指的长度，我想得到一个固定的圆圈，不管滚动条有多长。 以下是我所拥有的：

.container{
显示器：flex；
弯曲方向：行；
}
.列表1{
溢出y：滚动；
高度：100px；
宽度：100px；
利润率：50像素；
}
.list1:：-webkit滚动条轨迹
{
边界半径：10px；
边框：1px纯蓝色；
宽度：50px；
}
.list1:：-webkit滚动条
{
宽度：50px；
背景颜色：蓝色；
边界半径：10px；
}
.list1:：-webkit滚动条拇指
{
边界半径：100px；
背景色：红色；
边框：5px纯蓝色；
}

项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1


项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1

您只需在

.list1:：-webkit滚动条拇指中设置高度值

：

.list1::-webkit-scrollbar-thumb {
  height:50px;
}

---

.container{
显示器：flex；
弯曲方向：行；
}
.列表1{
溢出y：滚动；
高度：100px；
宽度：100px；
利润率：50像素；
}
.list1:：-webkit滚动条轨迹{
边界半径：10px；
边框：1px纯蓝色；
宽度：50px；
}
.list1:：-webkit滚动条{
宽度：50px；
背景颜色：蓝色；
边界半径：10px；
}
.list1:：-webkit滚动条拇指{
边界半径：100px；
背景色：红色；
边框：5px纯蓝色；高度：50px；
}

项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1


项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1
项目1

您好，我遇到了一个问题：如果我从“滚动”更改高度大小，则“我喜欢”将消失。。。有什么想法吗？谢谢lot@FacundoLaRocca你说的“我喜欢消失”是什么意思？更改哪个元素的高度？对不起，我的意思是，如果我更改列表的高度，例如更改为200px，thumb也会更改其高度。试着把列表的高度改为200px，我希望这能让你们明白我的意思。谢谢@法孔多拉罗卡检查。