Select Arrow missing on Safari Windows

Question

I added some styling to selects using the following class:

.form-fields select {
height: 24px;   
background: url(/Images/ui/input-bg.jpg) #FFF repeat-x;  
border: 1px solid #AAA;
}

This works in all browsers except it causes Safari on Windows to omit a drop down arrow. If I comment out both background and border properties (and only both) the arrow is restored yet the height is ignored in all the other browsers.

I'd like to keep this styling as Windows Safari is a minority but am curious to know if there is a solution that works for all.

Answer 1

Place this in your css

*{
 -webkit-appearance: menulist;
}

Answer 2

I was having the same bug on iPhone iOS. I removed a background-color:transparent; style and it fixed the missing select arrow browser UI.