1

Does anyone know how to fix formatting issues in Google Maps in WordPress. The map I have created is full of bugs. The main problem is that the stems of infoboxes don't show up, the cross to close an infobox isn't visible, some markers are difficult to open, the streetview pegman doesn't show up on screen and really annoyingly a multi-coloured box shows up in the middle of the map.

I know that the javascript is sound - it works fine when I load it in a plain HTML page. I've tried switching my theme to TwentyEleven but it doesn't make any difference.

I originally pasted all of the javascript in the post and I thought this might be causing the problem. I have since registered and enqueued the Google Maps library and then referenced my javascript file in the header of my theme. This hasn't made any difference.

You can see an example here: http://rhedeg.co.uk/pontsicill_map/#.UXmD1b-cO0s

Any ideas would be greatly appreciated. I am at the end of my tether but would like to avoid bringing in the professionals!!!

Many thanks!

wowzimmer
  • 151
  • 2
  • 2
  • 4
  • Check the max-width setting on images http://stackoverflow.com/questions/9663375/google-map-infowindow-not-showing-properly – Ashley Apr 25 '13 at 19:53

2 Answers2

1

Try this CSS trick:

#map-canvas img { 
  max-width: none;
}

#map-canvas label { 
  width: auto;
  display:inline; 
}
PiLHA
  • 2,326
  • 1
  • 24
  • 32
  • This is amazing!!!!! I have been banging my head against a table trying to get my Google Map to look right for so long. I was convinced that it was a problem with the Javascript loading in Wordpress that I hadn't even considered CSS. I'll be sleeping well tonight! – wowzimmer Apr 25 '13 at 21:27
0

The CSS trick that worked for me was:

#map img{max-width: inherit;}
wowzimmer
  • 151
  • 2
  • 2
  • 4