Zoom control and streetview not showing on my Google map?

Question

I'm inserting a very basic Google map into my page and the zoom control and streetmap icon are not visible, however if I place my mouse over where they should be I can zoom the map and enter streetview. So the controls are there just not visible.

<script type="text/javascript"     src="//maps.googleapis.com/maps/api/js?key=<apikey>&sensor=false&region=IT"> </script>  var myOptions = {     zoom: 17,     center: latlng,     panControl: true,     zoomControl: true,     zoomControlOptions: {         style: google.maps.ZoomControlStyle.LARGE     },     scaleControl: true,     mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

Any ideas what the problem could be?

Answer 1

That is definitely a CSS issue that you have with your code. Look for CSS that is applying to all images like:

img {   max-width: 100%; } 

Answer 2

I had this problem, the fix was to include this CSS ...

.gmnoprint img { max-width: none; } 

The CSS selector .gmnoprint img gets to all images [img] on the Google Map [gm] controls that are non printing [noprint]. In my case max-width had been set globally to 100%. Unsetting this fixed the issue.