+ 6

selector not works with input

input[type=range]{ -webkit-appearance: none; -moz-appearance: none; width: 300px; height: 20px; background: lime; } input[type=range]::-webkit-slider-thumb, input[type=range]::-moz-range-thumb{ -webkit-appearance: none; -moz-appearance: none; width: 20px; height: 20px; background: red; } input[type=range]::-webkit-slider-thumb:hover, input[type=range]::-moz-range-thumb:hover{ background: yellow; } <input type="range"> In this code I want the slider-thumb background yellow when hovering over it. But it not works. Why?

17th Jun 2020, 6:17 AM
Kashyap Kumar
Kashyap Kumar - avatar
2 Answers
+ 3
You can use WebKit and moz seperately Moz for input range is mostly use for Firefox web browser So you can put you code Seperately If someone access code in chrome ,opera etc then Brower will take -webkit code part or if the some access code in Firefox then Brower will access Moz part I have edited 🔫 Rick Grimes Bhiaya code here is what I am saying: https://code.sololearn.com/Wk0IO7lSZALL/?ref=app
17th Jun 2020, 2:00 PM
Coder - avatar
+ 2
It works only with -webkit- I tried removing -moz- and it works as you want. https://code.sololearn.com/WSUk70bJim63/?ref=app
17th Jun 2020, 1:12 PM
Raj Chhatrala
Raj Chhatrala - avatar