2

I don't really know how to explain this, the image pretty much speaks for itself. Looks the same on Chrome, Firefox and Internet Explorer.

I'm using jQuery Mobile, could that have anything to do with it?

enter image description here

My code, using Google Maps API V3.

var myOptions = {
        center:new google.maps.LatLng(59.3474845, 18.0621677),
        zoom:15,
        mapTypeId:google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map"),
        myOptions);

    var marker = new google.maps.Marker({
        map:map,
        position:myOptions.center
    });

    var infowindow = new google.maps.InfoWindow({
        content: '<p>boooyah</p>'
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map, marker);
    });

My css:

#map { height: 300px; width: 300px; }
Soroush Hakami
  • 5,226
  • 15
  • 66
  • 99
  • possible duplicate of [Google Map Infowindow not showing properly](http://stackoverflow.com/questions/9663375/google-map-infowindow-not-showing-properly) – Dr.Molle Mar 20 '12 at 12:07
  • inspect the global stylesheets, there must be something that has been applied to the map. – Dr.Molle Mar 20 '12 at 12:09
  • Thanks alot Dr Molle. This thread is an exact duplicate of the one you linked to, which helped solve my problem. – Soroush Hakami Mar 20 '12 at 12:15

3 Answers3

1

Had this problem recently.

It's caused by img{max-width:XXX} in css. Don't know why, but removing max-width from css will fix the rendering.

dfunkydog
  • 11
  • 1
0

The issue should be because of universal img{max-width: 100%;}

Try this one in to your css

.gmnoprint img {
    max-width: none; 
}
Mo.
  • 26,306
  • 36
  • 159
  • 225
0

The info window 'speech bubble' effect is created by google's API using a sequence of div elements. You may be breaking this with css - try turning off styles on your page and see if it still happens.

Oliver
  • 11,297
  • 18
  • 71
  • 121
  • I updated to show you my only css. I also debugged using the Chrome debugger to check out the element and found nothing out of the ordinary. – Soroush Hakami Mar 20 '12 at 12:05
  • @SoroushHakami If you use the webdeveloper toolbar for firefox you can turn off all styles with a click. As you say, its probably not the styles in this case, but it may worth checking anyway. unexpected interference from global styles are the cause for lots of problems people have with this API. – Oliver Mar 20 '12 at 12:11