Awesomeplete interferes with Bootstrap form-group styling

[eaglebush]

Hi,

My bootstrap form group default style is like this:

With Awesomeplete applied, it becomes this:

Is there a workaround with this?

Thanks for being Awesome!

[goulvench]

Hi @eaglebush, and anyone having the same issue. You need to override display for the awesomplete div which wraps the input. .form-group is in Bootstrap 4 but the following should work just the same (using Bootstrap 5):

/* Override awesomplete default style to match Bootstrap's block inputs */
.awesomplete {
  display: block;
}

<label for="input_id">Input label text</label>
<input type="text" class="form-control awesomplete" id="input_id" data-list="Ada, Java, JavaScript, Brainfuck, LOLCODE, Node.js, Ruby on Rails" />

Here's a codepen to see it live: https://codepen.io/goulvench/pen/VwpOXeE

[MSouilah]

Hi,
Thanks a lot, I thought I was crazy with this bug !!