custom svg icon does not align in the middle of the selector box

[DemersM]

Maybe someone could help with this issue. I am using the bootstrap theme with custom svg icon. It's working, but the icon is not aligned in the middle of the selector box. I have tried with v2.0.0 and master and both are not aligned correctly.

<style>
    .icon-airfield:before {  
        content: url("/media/airfield.svg"); 
        vertical-align:"middle" !important;
    }
</style>

<select id="id_form-0-marker" class="fontIconPicker select form-control" name="form-0-marker">
    <option selected="selected" value="">Please Choose</option>
    <option value="1">icon-airfield</option>
</select>

  $(".fontIconPicker").fontIconPicker({
          source: ['icon-airfield']
  });

Result:

See this jsFiddle: https://jsfiddle.net/5m9wco4b/6/

[swashata]

Closing since jsfiddle isn't showing any icon right now. I have plans to implement SVG natively #41 ... Feel free to reopen if the issue is still there.