0

I am working on a page where I need to add some style on hover of disabled option(in a select tag).

I have tried below css but none of them is working in internet explorer.

Code:

 select>option:disabled:hover {
        color:green;
    }
    
    select>option:hover([disabled]) {
     color:orange;
    }
     <select size=8 multiple>
      <option disabled>5<option>
      <option>10<option>
      <option>15<option>
      <option>20<option>
      </select>
Sunil Bamal
  • 87
  • 1
  • 14
  • Try making everything lowercase. IE is known to be very case sensitive. – MistaPrime Oct 07 '19 at 13:10
  • @MistaPrime Citation needed. – Mr Lister Oct 07 '19 at 13:10
  • still not working.. – Sunil Bamal Oct 07 '19 at 13:11
  • 1
    The linked duplicate doesn't mention `disabled`. https://stackoverflow.com/questions/15602140/how-to-style-disabled-options-in-a-form That question might help you. – Simon Brahan Oct 07 '19 at 13:12
  • @MrLister There have been reports of it on StackOverflow: https://stackoverflow.com/questions/12557948/ie9-suddenly-css-case-sensitive – MistaPrime Oct 07 '19 at 13:13
  • @MistaPrime Seriously, the case sensitivity of class and id names in quirks mode has nothing to do with this question. – Mr Lister Oct 07 '19 at 13:14
  • thanks @SimonBrahan but its not working for hover of disabled option – Sunil Bamal Oct 07 '19 at 13:16
  • 1
    the question you referred does not even contain text "disabled " @dippas .. – Sunil Bamal Oct 07 '19 at 13:23
  • If you just take the HTML you have shown, and try to set a color for the disabled option via IE dev tools, even that is not working (it accepts the style, but it doesn’t show any effect) … so my guess would be that this is simply not supported by IE at all. – 04FS Oct 07 '19 at 14:11
  • okay @04FS. can't we use javascript to achieve this? – Sunil Bamal Oct 09 '19 at 09:59
  • JavaScript is not going to convince IE to apply styles it wouldn’t apply if they were set directly. You can either replace your select field completely with a custom HTML implementation (select2 or similar), or you could try to _emulate_ the effect of `disabled` via JS (don’t set the actual attribute, but immediately de-select the option again, if it gets selected by the user.) – 04FS Oct 09 '19 at 10:03

0 Answers0