antd scrollbar always visibile (problem on firefox)

Question

I've a problem. My client wants the scrollbar of every single select in the project to be always visible. The problem is that using antd I don't have a lot of choise with regards to css. With trial and error I now can make the scrollbar always visible on Chrome (code below)

/*chrome*/
.rc-virtual-list-holder::-webkit-scrollbar {
  -webkit-appearance:button!important;
  width: 10px!important;
}
.rc-virtual-list-holder::-webkit-scrollbar-thumb {
  border-radius: 5px!important;
  background-color: rgba(0,0,0,.3)!important;
  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5)!important;
}

/*firefox*/

Anyway this css code doesn't work on Firefox, but for example it works on edge (but edge is not on the client requirements).

What can I do to make it work on Firefox?

thanks

Answer 1

try adding this code. this should make the scrollbar always visible on FireFox

.rc-virtual-list-holder {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, .3) transparent;
}

.rc-virtual-list-holder::-webkit-scrollbar {
  display: none;
}