How to size a Google Maps InfoWindow in Javascript

Yes. This is a duplicate of Google Maps API v3: InfoWindow not sizing correctly.
However, none of the solutions offered on that question worked for me :(

code:

 //after getting a 'position' object:
 var mapPos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
 var mapOptions = { zoom:16, center:mapPos,mapTypeId:google.maps.MapTypeId.ROADMAP };
 var yourLocationMap = new google.maps.Map(document.getElementById('locationMap'), mapOptions);

 var infoContent = '<div style="width:40px;height:20px;">some information content...</div>';
 var infoBaloon = new google.maps.InfoWindow({position:mapPos, content:infoContent, maxWidth:40});
 infoBaloon.open(yourLocationMap);

This is the HTML Google Maps creates for the info-window on top of the map:

<div style="width: 247px; height: 88px;"> //<-This is actually the size of the info
window. I have no idea on what basis it decides on these dimensions.

     //next is the div for the 'X'(close) button:
    <div style="width: 10px; height: 10px; overflow: hidden; position: absolute; opacity: 0.7; left: 12px; top: 12px; z-index: 10000; cursor: pointer;">
        <img src="http://maps.gstatic.com/mapfiles/mv/imgs8.png" style="position: absolute; left: -18px; top: -44px; width: 68px; height: 67px; -moz-user-select: none; border: 0px none; padding: 0px; margin: 0px;"></div><div style="cursor: default; position: absolute; right: 18px; top: 18px; z-index: 2; overflow: auto; width: 213px; height: 54px;">
    </div>

    // I don't know where this div is coming from... :\
    <div style="cursor: default; position: absolute; right: 18px; top: 18px; z-index: 2; overflow: auto; width: 213px; height: 54px;">
       <div style="overflow: auto;">

           **// and then, finally, the div I put in the Content of the InfoWindow:
           <div style="width:40px;height:20px;">Some content information...</div>**
       </div>
   </div>
</div>

Um, help?

NOTE: the #locationMap div has stylings for its size (not included in the code example). There are no problems in the representation of the map - just the representation of the InfoWindow which always seem to be 247px wide, no matter what I set its content to...

not sure if it helps but I found that there are actually 2 things that control the height of the infoWindow in google maps.

The contents of the infoWindow and the CSS that applies to the contents of infoWindow (most people are well aware of this)
(and what may be most confusing) the height of the google maps canvas itself!!!

I had a canvas that was set to 250px tall and regardless of how I styled the content that was to be placed in the infoWindow, it remained a fixed height of 88px and a scrollbar appear. Once I made the canvas a little larger (300px) the max-height of the infoWindow also changed.

If you think you are doing everything else right with sizing your infoWindow, the last resort is to make your canvas a little larger.

best of luck!