CODEWITHSUNDEEP
google-mapsgoogle-maps-api-3infowindow
Nick Poulos
Nick Poulos

Reputation: 488

Google Map Infowindow Not Appearing Properly

I have a standard Google Map Infowindow being opened on click on a standard Google Marker. The arrow pointing down to the marker seems to be a couple of pixels off. I have been banging my head against the wall trying to figure out what properties in my CSS are affecting it. The ZURB Foundation framework properties affecting img { max-width: 100% } were causing some other problems, but I was able to track that down and adjust. I can't seem to find the cause of this one though. I am using ZURB v4 and GMapsv3.

http://stage2.curran-connors.com/reliance/index.php/contact/

Click a marker and you will see the arrow starts just below the border of the info window.

Upvotes: 3

Views: 1051

Answers (2)

zeeshan
zeeshan

Reputation: 1

The same problem I have faced, controls were not showing and Infowindow was not appearing properly. JavaScript shows,

Uncaught Type Error: undefined is not a function.

Commenting/removing the following code from prototype.js resolved my problem

this.each(function(value, index) {

      results.push(iterator.call(context, value, index));
});

Upvotes: 0

Pete Parker
Pete Parker

Reputation: 133

Zurb Foundation sets the box-sizing style on everything to border-box. This causes the alignment error that you are seeing in the Google Maps info window.

The fix:

#map_container div {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

Upvotes: 4

Related Questions