Text-decoration not working in Google chrome drop down (Select) option

Question

I have the drop down list, and i want to strike through the specific option. I'm using the below sample code, the red color is working fine but line-through is working in IE, but not working in chrome

<select>
<option>option 1</option>
<option style="text-decoration:line-through; color:red;">option 2</option>
<option>option 3</option>
</select>

I want to apply this without any jquery or any other library, just by directly through JavaScript & css

https://stackoverflow.com/questions/5887133/how-to-style-a-select-tags-option-element — Yordan Ramchev, Dec 06 '17 at 12:34
Apparently , this problem has been solved with a new update of Chrome. Update your Chrome Version. — Ritesh Ranjan, Dec 06 '17 at 12:38
I'm using Google chrome Version 62.0.3202.94 (Official Build) (64-bit), its not working. which version onwards it is supported — Mathiyazhagan, Dec 06 '17 at 12:44

score 1 · Answer 1 · answered Dec 06 '17 at 12:56

1

A crude but working way to do this would be to just use a Unicode text generator like this one http://adamvarga.com/strike/. And it would end up working like this:

    <select>
        <option>option 1</option>
        <option>s̶t̶r̶o̶k̶e̶n̶</option>
        <option>option 3</option>
    </select>

I am guessing it's a bug in chrome from what people before me wrote

answered Dec 06 '17 at 12:56

Linushg111

76
7

@Mathiyazhagan If this helped you can mark it as a solution? – Linushg111 Dec 07 '17 at 21:43

Text-decoration not working in Google chrome drop down (Select) option

1 Answers1