title: html select with different background color for every option that works properly in every browser?
body: <p>I am looking to build multiple html select elements with custom background colors for each option:</p>
  
  <pre><code>&lt;select runat="server" id="select"&gt;
  &lt;option value="A"&gt;White&lt;/option&gt;
  &lt;option value="B"&gt;Red&lt;/option&gt;
  &lt;option value="C"&gt;Yellow&lt;/option&gt;
  &lt;option value="D"&gt;Green&lt;/option&gt;
  </code></pre>
  
  <p></p>
  
  <p>When the website loads, I would like the select element to display only the background color and no text for the selected option. The text (white, red,....) should only be visible when the dropdown is opened.</p>
  
  <p>As the selected value is changed by the user, the background color should change as well while the text should be invisible in the closed dropdown.</p>
  
  <p>It would be really nice if the solution works on most browsers including IE 9/10.</p>
  
  <p>Cheers.</p>