Problemas con Awesomplete al usar Bootstrap

En este artículo te explicaré un problema que me pasó hace algún tiempo usando la librería Awesomplete y el framework Bootstrap.

Pasa que al hacer un autocompletado con AJAX,  el input perdía su estilo y se mostraba a la derecha de la etiqueta. Algo así:

Cuando en realidad, debería mostrarse así:

Corrigiendo problema

Es muy fácil, simplemente hay que modificar el código de awesomplete en awesomplete.base.css y eliminar, dentro del selector .awesomplete, el estilo de display: inline-block;

Originalmente está así:

.awesomplete {
    display: inline-block;
    position: relative;
}

Pero debemos eliminar o comentar ese estilo, así:

.awesomplete {
    /*display: inline-block;*/
    position: relative;
}

Algún experto en CSS debe saber la razón. Tal vez es el comportamiento que el autor de la librería quería, no lo sé, pero así se arregla el error que ocurre al usar Awesomplete con Bootstrap.