Edges get cut off - Bootstrap Input group

Hi,
When we use Bootstrap’s input-group with Ionic, the edges of the label get cut off. I created a js fiddle to show the issue http://jsfiddle.net/sonyarouje/zw7s279n/8/

here is the html

<div class="row">
<div class="col-xs-6">
    <div class="input-group"> 
       <span class="input-group-addon"> Find </span>
        <input type="number"  class="form-control" />
        <span class="input-group-addon"> <i class="fa fa-search"></i> </span>
    </div>
</div>

Every thing works fine if we remove type=“number” or type=“text” from the input tag or if we remove ionic.css file.

Any help will be really appreciated.

Regards,
Sony Arouje

It is really not recommended to use ionic with bootstrap.

There are many equal class names. So they are overwriting each other.

Greetz, bengtler.