bassjobsen / typeahead.js-bootstrap-css

LESS / CSS code for using typeahead.js with Bootstrap 3
MIT License
192 stars 127 forks source link

List Position Error when using bootstrap has-feedback has-error styling dynamically #28

Open TharinduAmila opened 6 years ago

TharinduAmila commented 6 years ago

I have added typeahead to an email input and wanted to customize this to suggest domains. Anyhow I am not able to get typeahead suggestions to align correctly with my input. This is my html <div id="emailFormGroup" class="form-group"> <label for="email">Email</label> <input type="email" id="email" autocomplete="off" name="email" class="form-control" dataprovide="typeahead" placeholder=" yourname@company.com "> <span id="email-feedback" class="form-control-feedback hide" aria-hidden="true"><i id="valid-msg-email" class="fa fa-check hide"></i><i id="invalid-msg-email" class="fa fa-times hide"></i></span> </div>

I add classes has-feedback and has-error dynamically according to user input This makes the typeahead list to jump around when the styling changes. image

It rectifies when the styling stays the same

image