1

I am using the google map Autocomplete. I have a div element where I have an input element to search the location. And I get a drop-down list of possible locations. How can I get the list to be on the top instead of showing below the search text-field (As a "Drop-up" list ??).

Reference: https://developers.google.com/maps/documentation/javascript/places-autocomplete#places_searchbox

HotelAlpha744
  • 39
  • 4

1 Answers1

2

Actually, I got it working after certain hours of trial and error! For future references, if somebody has the same issue, here's how I got it working.

The element where the locations are listed is given the class name of "pac-container" by google API. Google API Elements for Autocomplete

So, just had to play with the CSS for the "pac-container" element to show on top.

Here's the CSS:

.pac-container
{
 position:fixed;
 display:block;
 margin-top: -210px;
}

And this is how a search looks now:Google Autocomplete Drop-up for Dallas Search

HotelAlpha744
  • 39
  • 4