Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery ui autocomplete positioning wrong
    primarykey
    data
    text
    <p>using jquery ui 1.8 trying autocomplete</p> <p>Everything works apart from that the ui-menu isn't positioned under my input element, but rather in the top left corner.</p> <p>Has anyone come across this problem? </p> <p>Here's my html:</p> <pre><code>&lt;div id="search"&gt; &lt;div id="searchFormWrapper"&gt; &lt;form method="post" name="searchForm" id="searchForm" action="/searchresults"&gt; &lt;label for="searchPhrase" id="searchFor"&gt; Search for&lt;/label&gt; &lt;input name="searchPhrase" id="searchPhrase" type="text" /&gt; &lt;label for="searchScope" id="searchIn"&gt; in&lt;/label&gt; &lt;select name="searchScope" id="searchScope"&gt; &lt;option value=""&gt;All Shops&lt;/option&gt; ... &lt;/select&gt; &lt;input type="image" name="submitSearch" id="submitSearch" src="/images/buttons/search.gif" alt="Search ..." /&gt; &lt;/form&gt; &lt;br class="clear" /&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>and here's my css:</p> <pre><code>#search { width:100%; margin:0; padding:0; text-align:center; height:36px; line-height:36px; background:#666 url(/images/interface/info_bar_bg.gif) repeat-x top left; overflow:hidden; font-size:12px; } #searchFormWrapper { width:520px; height:36px; overflow:hidden; margin:auto; padding:0; } label#searchFor { display:block; float:left; width:80px; padding:0 5px 0 0; margin:0 0 0 0; text-align:right; } label#searchIn { display:block; float:left; width:20px; padding:0 5px 0 0; margin:0 0 0 0; text-align:right; } #searchPhrase { display:block; float:left; width:120px; margin:7px 0 0 0; padding:0; } #searchScope { display:block; float:left; width:120px; margin:7px 0 0 0; padding:0; } #submitSearch { display:block; float:left; margin:7px 0 0 10px; padding:0; } </code></pre> <p>and here's my javascript:</p> <pre><code>$(document).ready(function() { $("#searchPhrase").autocomplete( { source: "/search?json", minLength: 2 }); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload