I’m trying to style a Range to have rounded edges to match a designer’s mockups.
I was able to get the rounded edges on the track with:
input[type=range]::-webkit-slider-runnable-track {
border-radius: 3px;
}
But I’m not having luck getting the border-radius on the color fill before the thumb slider. I’ve tried a couple of places but have been looking at the following block of code:
range.range-stable input::-webkit-slider-thumb:before {
background: #b2b2b2; }
Can I add a border-radius to the color fill?
Thanks!