Visualisation problem with autocomplete


I implemented autocomplete functionality for search engine ( and receive some problems:

  1. When selected list have items more then one screen I can’t scroll it. Scrolling background page, but not front list of searched items.
  2. There is the big indent in list of items
  3. Before 3 letters search engine not working

Please help. First problem is very uncomfortable



  1. i dont know your css aside from f7 styles.
    but you can try by adding a fixed height to autocomplete-dropdown-inner
.autocomplete-dropdown-inner {
  height: 300px;
  overflow-y: scroll; // dont know if you need this, try without it first.
  1. autocomoplete has padding-left: 56px;

so try override that.

.autocomplete-dropdown-inner.list ul {
  padding-left: 56px; // Current value, change it to your need.
  1. Cant reproduce it. i try on my pc and type ‘a’. it works, 38 results

Thank you so much! All working.

  1. I change this:
    .md .list ul ul {
    padding-left: 0px;

It’s possible to hide iOS keyboard when I scroll list of items? And show again when I starting writing.
Not so comfortable to see result in area between search input and keyboard.

You can try with a plugin.

#### Description

Call this method to hide the keyboard