Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to set font-family in HTML select dropdown list in IE?
    primarykey
    data
    text
    <blockquote> <p><strong>Possible Duplicate:</strong><br> <a href="https://stackoverflow.com/questions/4672960/change-css-font-family-for-separate-options-in-select-tag">Change css font-family for separate options in select tag</a><br> <a href="https://stackoverflow.com/questions/6655625/styling-options-in-bold-in-internet-explorer">Styling options in bold in Internet Explorer</a> </p> </blockquote> <p>I am not able to set font-family of a dropdown list of HTML select in IE8,9. <strong>Is it a bug/property or am I doing something wrong?</strong> Font-size setting works. The example is too extreme my real problem is that I have different font on the page and in the list. <br> I don't care about IE7-. </p> <p><strong>Example( <a href="http://jsfiddle.net/SDcLX/11/" rel="nofollow noreferrer">http://jsfiddle.net/SDcLX/11/</a>):</strong></p> <p>I have following HTML:</p> <pre><code>aaaaa &lt;div class="container"&gt; skjhlks &lt;select&gt; &lt;option class="courier"&gt;courier&lt;/option&gt; &lt;option&gt;aa&lt;/option&gt; &lt;option style="font-family:impact;" selected="selected" &gt;bb&lt;/option&gt; &lt;/select&gt; &lt;/div&gt; </code></pre> <p>and CSS</p> <pre><code>.container { font-size:30px; font-family:Lucida Handwriting; } select { font-family:inherit; font-size:inherit; } option.courier { font-family:courier; } </code></pre> <p>The result in FF is:</p> <p><img src="https://i.stack.imgur.com/5Hxnw.png" alt="enter image description here"></p> <p>and in IE:</p> <p><img src="https://i.stack.imgur.com/i5mkx.png" alt="enter image description here"></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload