gMaps openInfoWindowHTML

I was building a small tool for visitflorida.com today using google Maps which we all love.

I ran into a small problem when I was passing the html content of the infoWindow in a div. It seems that for some reason I could restrict the max width of the info window but it was adding white space under the content, that made the info windows look pretty ugly. I was playing around with negative margins but that even made the problem worst in IE.

Eventually i ran across this – the inherited CSS problem. If you read this article it’s pretty clear when the window size is computed and it actually makes a lot of sense. So you may or may not have some kind of an CSS inheritance going on, but for the purposes of this lets say you do.

Lets imagine you have a CSS class that defines default div style , tricking the infoWindow is very simple, just add to the div that holds your infoWindow content something like style=”font-size: XXpx;” . This will help the gMap to properly compute the needed height for the container before it gets displayed.

Sounds stupid but it took me about an hour figuring out where that ugly white space was coming from.

I hope this helps !