Google maps info window scrollbar bug & workaround

The first map has the info window scrollbar bug. The second one has a workaround with help of a content wrapping div and css. See line #19 @ JS + CSS

by veaz

HTML

<script src="https://maps.google.com/maps/api/js?sensor=false&amp;amp;language=de"></script>
<!-- Map wrapper for info window scroll bar bug -->
<div id="map_canvas" style="height: 250px; width: 400px;"></div>

<!-- Map wrapper for info window workaroung -->
<div id="map_canvas2" style="height: 250px; width: 400px;"></div>

CSS

/* CSS definitions for the wrapping div */
.scrollFix {
    line-height: 1.35;
    overflow: hidden;
    white-space: nowrap;
}

JavaScript

// Define location of map and info windows
var latLng = new google.maps.LatLng(49, 12);

// Some options and start up maps
var myOptions = { center: latLng, zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP };
var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
var map2 = new google.maps.Map(document.getElementById('map_canvas2'), myOptions);

// Dummy content
infoWindowContent = '<b>Location</b><br/>some timestamp<br/>some geocoding location address<br/>Coordinates: 49.00000  |  12.00000';

var infoWindow = new google.maps.InfoWindow({
    content: infoWindowContent,
    position: latLng
}).open(map);

// Content of second info window has wrapping div
var infoWindow2 = new google.maps.InfoWindow({
    content: '<div class="scrollFix">'+infoWindowContent+'</div>',
    position: latLng
}).open(map2);