html - Change cursor over <option> tags?

Question

Is there any way to change the cursor when hovering over an item in a <select> combobox? I assumed that doing option { cursor: pointer; } in CSS would work, but it doesn't seem to.

Answer 1

Make your own dropdown

<option> tags are rendered by the operating system, not the browser, so you can't style them.

Instead, make your own dropdown that you can fully control or use a 3rd-party plugin, for example Bootstrap's Dropdown.

MSDN says it best:

Except for background-color and color, style settings applied through the style object for the option element are ignored. In addition, style settings applied directly to individual options override those applied to the containing select element as a whole.

MDN also chimes in

Some elements simply can't be styled using CSS. These include all advanced user interface widgets such as range, color, or date controls as well as all the dropdown widgets, including <select>, <option>, <optgroup> and <datalist> elements. The file picker widget is also known not to be stylable at all. The new <progress> and <meter> elements also fall in this category.