Easyautocomplete And Width Of Input

When I add behavior='autocomplete' to my input field, width is changing and not scaling anymore with browser/screen resize. Someone experienced with easyAutocomplete has the same p

Solution 1:

With your jQuery easyautocomplete plugin you just need to set option adjustWidth to false and then you don’t need to touch your CSS.

var options = {
  ...
  adjustWidth: false,
  ...
};

$("#example").easyAutocomplete(options);

Solution 2:

You can use easy-autocomplete like below, no need to put data-behavior. Also, you need to override CSS applied by the easy-autocomplete library.

var options = {
 data: ["blue", "green", "pink", "red", "yellow"]
};

$("#example").easyAutocomplete(options);

.easy-autocomplete{
  width:100%!important
}

.easy-autocompleteinput{
  width: 100%;
}

.form-wrapper{
  width: 500px;
}

<linkhref="https://unpkg.com/easy-autocomplete@1.3.5/dist/easy-autocomplete.min.css"rel="stylesheet"/><scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://unpkg.com/easy-autocomplete@1.3.5/dist/jquery.easy-autocomplete.js"></script><formclass="form-wrapper"><inputid="example"class="form-control"type="text"placeholder="search"></form>