SumoSelect的select-all选项与选择下拉列表中的其他选项重叠

Question

I have a SumoSelect select drop down in my CodeIgniter application and inside that the select all option has smaller height as compared to other items, and due to this, select all option overlaps other option in the drop down list. I have tried to increase the height of select-all option element using jQuery but I think the height of <option> can not be modified manually. So please tell how to resolve this overlapping issue?

Code:

<select name="type" id="type" multiple="multiple" placeholder="Select a type" class="form-control SlectBox">                          
    <?php foreach($types as $type) { ?>
        <option>$type</option>
    <?php } ?>
</select>

<script>
    $(document).ready(function() {
        window.asd = $('.SlectBox').SumoSelect({ 
            csvDispCount: 3,
            selectAll: 1,
            captionFormat: '{0} types selected!',
            captionFormatAllSelected:'All {0} types selected!'
        }); 
        <?php if(count(array_filter($Type_list))==0){?>
            $('select.SlectBox')[0].sumo.selectAll();
        <?php } ?>      
    });
</script>

Overlapping Issue:

Answer 1

As a quick fix in Firefox, this solution worked for me. I added the following style to my css file for the page.

.SumoSelect .select-all {
  display: table-cell;
}