I have the following drop down menu and the background looks black in Chrome but white on Firefox/IE/Safari across Windows/Linux/Mac. I'm using the latest versions of all those browsers.
<style>
select {
background-color: transparent;
background-image: url(http://sstatic.net/so/img/logo.png);
}
</style>
<select>
<option>Serverfault</option>
<option>Stackoverflow</option>
<option>Superuser</option>
</select>
Does anyone know how I can style the above so that Chrome shows the background as white when the color is set to transparent like in the other browsers?
EDIT: My goal is to display an image in the background of select. The image shows up properly in every browser except Chrome.
Why are you using background-color: transparent; for "select"? If you remove that chrome works.
What is the effect you are after? Maybe some demo?
According to this and this, it is a bug in Chrome that is supposed to be fixed.
The bug appears in version 2.0. I just tested it in 3.0-beta, and it's fixed.
This answer https://stackoverflow.com/a/5806434/964227 that I found in another question just like this worked perfectly for me.
Apparently Chrome doesn't accept an image as a select background. So, in order for the color to work, you have to remove the image and then set the color. I'll just copy and paste the other answer here.