位置JQueryAutocomplete結果

Question

我在我的網站中實現了JQuery自動完成，我在搜索表單中顯示結果時遇到問題。搜索表單嵌入在主佈局的Bootstrap3導航欄中。

inside navbar 

<div class="col-sm-3 col-md-3" id="search"> 
    <form class="navbar-form" role="search" action ="{{ path('search')}}" method ="get"> 
     <div class="input-group"> 
      <input type="text" class="form-control" placeholder="Search city/town" name="query" value="{{ app.request.get('query') }}" id="search_keywords"> 
     <div class="input-group-btn"> 
      <button class="btn btn-default" type="submit"><i class="fa fa-search"></i></button> 

     </div> 
     </div> 
    </form> 
</div> 

JS

<script> 
    $(function() { 
     function log(message) { 
      $("#log").scrollTop(0); 
     } 
     $("#search_keywords").autocomplete({ 
      source: "{{ path('city_autocomplete') }}", 
      minLength: 2, 
      messages: { 
       noResults: '', 
       results: function() {} 
      }, 
      select: function(event, ui) { 
      log(ui.item ? 
       "Selected: " + ui.item.value + " aka " + ui.item.label: 
       "Nothing selected, input was " + this.value); 
       $("#search_keywords").val(ui.item.label); 
       $("#search_keywords").val(ui.item.value); 
       return false; 
      }, 
      change: function(event, ui) { 
       $("#search_keywords").val(ui.item? ui.item.value : 0); 
      } 
     }); 
    }); 
</script> 

我想要的搜索表單和結果，因爲結果之間的「差距」是在搜索表單部分「隱藏的」。

內部JQuery的，我加

position: { my : "bottom+3" }, 

但它不工作。 從CSS開始，除了一些表格和表格與這個搜索表單和佈局不相關，我非常依賴bootstrap的cdn，所以我沒有爲這個搜索表單定製css。 任何想法？

Answer 1

就解決了這個問題

.ui-autocomplete { 
margin-top: 20px !important; 
top: 0px !important; 

}