How do I add icons to a multiselect component?
I have found a Firefox only solution (see my answer below); but have found nothing interoperable.
Should I just give up on this feature?
Firefox only solution was found here: http://www.456bereastreet.com/lab/styling-form-controls-revisited/select-multiple-option, with:
HTML:
<select id="el03" size="3" multiple="">
<option selected="">
#el03 Option 1
</option>
<option>
#el03 Option 2
</option>
<option>
#el03 Option 3
</option>
<option>
#el03 Option 4
</option>
<option>
#el03 Option 5
</option>
</select>
CSS:
#el03 option {
background: url("/i/icon-info.gif") no-repeat scroll 100% 50% transparent;
}
Run the code: http://plnkr.co/edit/ZPnRq0REy0LN8eDKHWni?p=preview