How can I change the font-size of one select box option text (select2) with css?

The solution:

http://jsfiddle.net/jEADR/3730/

<select  id="e1" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

    <select  id="e2" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

<script>
$(".select2").select2();
$("#e2").select2({ dropdownCssClass: "myFont" });
</script>

.myFont{
  font-size:4px;
}

The best answer I've discovered for this problem is to wrap the select in a div and set the CSS as follows.

CSS:

.fooSelect
{
    display:inline;
}
.fooSelect .select2-selection__rendered
{
    font-size:1.2em;
}

Other code:

<div class="fooSelect"><select  id="e1" class="select2" style="width:300px">
    <option value="AL">Alabama</option>
    <option value="Am">Amalapuram</option>
    <option value="An">Anakapalli</option>
    <option value="Ak">Akkayapalem</option>
    <option value="WY">Wyoming</option>
</select></div>


<script>
    $("#e1").select2();
</script>

My change on here

Just add to every option class and use it.

On js file

$("#e1 option,#e2 option").addClass("font-size-4");
$(".select2").select2();

On Css file

.font-size-4{
   font-size:4px;
}