Topic: Change range bubble color
How do I change the color of the bubble that appears above the range slider when someone clicks and drags it? The one with the number in it.
https://mdbootstrap.com/docs/standard/forms/range/#docsTabsOverview
Anything? I can see that the actual slider color can be changed via --
.form-range::-webkit-slider-thumb {
background-color: #fff !important;
}
.form-range::-moz-range-thumb {
background-color: #fff !important;
}
.form-range::-ms-thumb {
background-color: #fff !important;
}
Hello, it's possible using .range .thumb:after selector, for example:
.range .thumb:after {
background: rebeccapurple;
}
Please see the snippet with the solution: https://mdbootstrap.com/snippets/standard/m-duszak/3253874#css-tab-view
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 3.9.0
- Device: PC
- Browser: Chrome
- OS: Win
- Provided sample code: No
- Provided link: Yes