Change Select List Option background colour on hover

css, drop-down-menu, html

Solution

This can be done by implementing an inset box shadow. eg:

select.decorated option:hover {
    box-shadow: 0 0 10px 100px #1882A8 inset;
}

Here, `.decorated` is a class assigned to the select box.

Hope you got the point.

Problem

Is it possible to change the default background color of a select list option on hover? ``` option:hover { background-color: red; } ``` ``` <select id="select"> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> ``` I have tried `option:hover { background-color: red; }`, but it is of no use. Does anybody know how to do this?

Original source