How can you CSS style a <select> tag?

Question

How can you use CSS to set the color of the highlighted item in a <select> dropdown?

I mean while the dropdown is active, as you hover the mouse over items in the list, the items are highlighted in a teal color.

Changing other css attributes of the <select> works fine, but not the hover/highlight color for an item.

Thank you-

Answer 1

Hi,

you would not do that on the <select> tag. You better use the hover property of the option-tag. Try something like the following:

...
<style type="text/css">
  option:hover
  {
    background: #C6C4BD;
  }
</style>
...
<select>
  <option>Item 1</option>
  <option>Item 2</option>
  <option>Item 3</option>
</select>
...

---

Best Regards. When you see answers and helpful posts, please click Vote As Helpful, Propose As Answer, and/or Mark As Answer. This helps us build a healthy and positive community.

Answer 2

Thanks that will work -