title: Is it possible to center text in select box?
body: <p>I tried this: <a href="http://jsfiddle.net/ilyaD/KGcC3/" rel="noreferrer">http://jsfiddle.net/ilyaD/KGcC3/</a></p>
  
  <p>HTML:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;select name="state" class="ddList"&gt;
      &lt;option value=""&gt;(please select a state)&lt;/option&gt;
      &lt;option class="lt" value="--"&gt;none&lt;/option&gt;
      &lt;option class="lt" value="AL"&gt;Alabama&lt;/option&gt;
      &lt;option class="lt" value="AK"&gt;Alaska&lt;/option&gt;
      &lt;option class="lt" value="AZ"&gt;Arizona&lt;/option&gt;
      &lt;option class="lt" value="AR"&gt;Arkansas&lt;/option&gt;
      &lt;option class="lt" value="CA"&gt;California&lt;/option&gt;
      &lt;option class="lt" value="CO"&gt;Colorado&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre class="lang-css prettyprint-override"><code>select { width: 400px; text-align: center; }
  select .lt { text-align: center; }
  </code></pre>
  
  <p>As you can see, it doesn't work.  Is there a CSS-only way to center text in the select-box?</p>