title: Why Open Sans fonts seems to be corrupted when using for select box as font face in chrome and opera?
body: <p><strong>HTML</strong></p>
  
  <pre><code>&lt;select multiple="multiple"&gt;
      &lt;option&gt;Option-1&lt;/option&gt;
      &lt;option&gt;Option-2&lt;/option&gt;
      &lt;option&gt;Option-3&lt;/option&gt;
      &lt;option&gt;Option-4&lt;/option&gt;
      &lt;option&gt;Option-5&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>@font-face {
      font-family: 'OpenSansRegular';
      src: url('OpenSans-Regular-webfont.eot');
      src: url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg'),
      url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
      url('OpenSans-Regular-webfont.woff') format('woff'),
      url('OpenSans-Regular-webfont.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
  
  }
  
  select {
      width: 150px;
      height: 150px;
      padding: 10px;
      font-size: 18px;
      margin: 20px;
      font-family: 'OpenSansRegular',Arial,sans-serif;
      font-weight: normal;
  }
  </code></pre>
  
  <p>I use OpenSans font as font-face with using fontsquirrel webfontkit tool. Everything seems normal for ff,ie,safari but when open page in chrome or opera, it seems as below image;
  <img src="https://i.stack.imgur.com/WkJnK.png" alt="enter image description here"></p>
  
  <p>My code as above. Why fonts seems to be corrupted for chrome and opera?</p>