1

I have used following solutions..

select:hover {
color: #444645;
background: #ddd;
}

And

select option:hover {
color: #444645;
background: #ddd;
}

But it didn't work. Please help me with your solutions. Thanks.

shubhra
  • 41
  • 1
  • 5
  • 1
    Please add your remaining codes. – frnt Apr 21 '17 at 10:34
  • Are you trying to change the default hover color for form select option elements? ... You can't: http://stackoverflow.com/questions/17740391/change-select-list-option-background-colour-on-hover-in-html – Asons Apr 21 '17 at 12:38

3 Answers3

1

The style of a select component is browser AND OS specific. So it's different across Chrome, Firefox, IE, etc. AND Windows and Mac.

I'm afraid you can't style the dropdown.

You can style the select box as shown here, but the dropdown is a no go.

If you really want a custom dropdown, I'm afraid you'll have to resort to using javascript.
Here's a basic tutorial on creating one.

Paul van den Dool
  • 3,020
  • 3
  • 20
  • 44
0

Can you elaborate some more on the context? Maybe provide the html file you were working on?

Right now you are adding behavior to a <select> element. If it is the page's background you are trying to change, you will need to target the <body> tag.

gnzg
  • 370
  • 3
  • 5
  • 17
  • Well, i am working on GWT and here i have a global external .css file. I know how to use this css file for styling, but i really don't know how to use this – shubhra Apr 21 '17 at 11:27
  • 2
    If GWT comes with its own stylesheet(s), you should add that to the question, because this is information vital to the solution. – Mr Lister Apr 21 '17 at 12:09
0

The first one works at least Chrome and Firefox

select:hover {
color: #444645;
background: #ddd;
}

Try it at:

https://codepen.io/pekechis/pen/LyNMea

pekechis
  • 288
  • 6
  • 18