InfoWindow curve messed up using Google Maps API v3

Question

I simply place the marker on the map (after it is set up and centered, as in the example code in the Google documentation) using the geocoder and place the info window on it like this:

geocoder.geocode( { 'address': address}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { var marker = new google.maps.Marker({ position: results[0].geometry.location, map: map, title: title }); google.maps.event.addListener(marker, 'click', function () { console.log('openInfoWindow'); infoWindow.setContent(content); infoWindow.open(map, marker); }); }; }); 

content is just an HTML link, address is a valid address (since I have no problem displaying a marker).

As you can see in this picture, I have a small graphical problem:

This is like css sprite - everything ... is corrupted. I have no idea where this problem came from, it was for a while, and I'm annoyed ... any guess is useful at this moment. Screen capture is the same in Webkit (Safari and Chrome) and Firefox.

Answer 1

As expected by mkilmanas , this was a colliding CSS declaration. I had this in my CSS file:

 img { max-width: 300px; } 

I fully understand how stupid it was. Thanks a lot mkilmanas .

Answer 2

This is an old but more general solution from the github problem:

 img[src*="gstatic.com/"], img[src*="googleapis.com/"] { max-width: 99999px; }