Alignment off when using bootstrap input-group

[mrnickel]

With the following markup the alignment of the completer-dropdown is off. Doesn't seem to be able to take into account the height of the field:

<div class="form-group row">
    <div class="col-lg-2">
        <div class="input-group">
            <ng2-completer [inputClass]="'form-control'" 
                [(ngModel)]="customerCode" 
                [datasource]="customerAutoCompleteDataService" 
                [minSearchLength]="2"
                (selected)="onCustomerSelected($event)" 
                (blur)="lookupCustomer(customerCode)" 
                [ngModelOptions]="{standalone: true}">
            </ng2-completer>
            <span class="input-group-btn">
                <button class="btn btn-default" type="button" (click)="showChildModal()">&hellip;</button>
            </span>
        </div>
    </div>
</div>

This is using bootstrap 3.3.7

[suryakand]

Add this class to your page (not in Angular component or template): .completer-input { width: 100% !important; }