Question

I’ve simplified my JavaScript code to the example below; this code is giving me a huge border below the text in my infoWindow. Looking at examples on the web with single line infoWindows it seems like this is a standard feature. Is there any way to eliminate this?

Thanks

    var marker = new GMarker(point);

    map.addOverlay(marker);

    GEvent.addListener(marker, "mouseover", function () {

    marker.openInfoWindow('a<br />b<br />c<br />d<br />a<br />b<br />c<br />d<br />a<br />b<br />c<br />d<br />');

        }
    );

Update: Found the answer, this CSS is causing the problem .gmnoprint {
font-size:12px;
} The smaller font-size seems to be making the infoWindow display as though it was displaying the default font-size, hence the extra space. Does anyone have a good solution? Thanks

Answer 1

Answer was the simplest one: Add a new CSS class with the amended font size (e.g. myGoogleMapInfoWindow, and add a <div class="myGoogleMapInfoWindow"> around the content of your openInfoWindow argument. This makes the Google Maps API behave correctly. Of course it is better to do this using DOM objects rather than a HTML string. The answer seems obvious now, but it was someone else’s code I had to fix this on.