How To Apply Font Family In HTML Tag Of Select Option

I am applying Font family in tag but it is not working any option guys My code :

Solution 1:

You have a syntax error in your inline style, the correct syntax is:

option {
    font-family: 'sans-serif'
}

or with inline styles:

<option style="font-family: sans-serif">Font-familly Name</option>

• 'sans-serif' should be replace for the font you want.

Solution 2:

This is how my code run

Insert fonts in head tag

/* BAHAMAS */
@font-face {font-family: 'BAHAMAS'; src: url('../fonts/BAHAMAS0.eot');}
@font-face {font-family: 'BAHAMAS'; src: url(//:) format('no404'), url('../fonts/BAHAMAS0.ttf') format('truetype'); font-weight: normal; font-style: normal;}

call fonts

<option style="font-family:BAHAMAS;">My Font</option>

Solution 3:

#select-group{
font-family: 'samim'!important;}

its cant work in firefox ------But it will work in Chrome!:)

Solution 4:

So easy

Just see this demo

#select1 {
  font-family: 'sans-serif';
}

#select2 {
  font-family: tahoma;
}

#select3 {
  font-family: monospace;
}

<select id="select1">
        <option>OPTION 1</option>
        <option>OPTION 2</option>
        <option>OPTION 3</option>
    </select>
<br/>
<select id="select2">
        <option>OPTION 1</option>
        <option>OPTION 2</option>
        <option>OPTION 3</option>
    </select>
<br/>
<select id="select3">
        <option>OPTION 1</option>
        <option>OPTION 2</option>
        <option>OPTION 3</option>
    </select>

Share

You may like these posts

• 
  How To Manage Ajax Code To Display Image And Video Using Switch Case On HTML
• 
  Manually Typing VS Setting Value In JS
• 
  Rendering Issues With IE7 In Quirks Mode
• 
  Strange Rendering Issue In Chrome With Floats In A Div With Margin-top