Google Maps markers shifted only in Firefox if CSS margin property for map canvas is set -

the clickable (or "catchment" area) markers on google maps seem incorrectly shifted if <div> holding map canvas styled css margin property different 0px.

smallest working example incorrect location of marker area designated red circle (the title "marker" should appear around circle):

var map;    function initialize() {    var mylatlng = new google.maps.latlng(51.0, 17.0);      map = new google.maps.map(document.getelementbyid('map-canvas'), {      zoom: 8,      center: mylatlng    });      var marker = new google.maps.marker({      position: mylatlng,      map: map,      title: 'marker'    });  }    initialize();

  body {      margin: 0;      padding: 0;    }    #map-canvas {      width: 300px;      height: 300px;      margin: 30px;      border: 1px solid #ccc;    }    #position {      position: fixed;      top: 120px;      left: 140px;      width: 15px;      height: 15px;      border: 2px dashed #f00;      border-radius: 15px;    }

<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>  <div id="map-canvas"></div>  <div id="position"></div>

working example on jsfiddle: http://jsfiddle.net/n6ccz1n0/

the issue detected on firefox 39.0 (chrome , internet explorer render properly).

it might issue related 1 described here: position relative in firefox causing problems google-map-markers clickable area