Basic Google Map with Marker Problem...

Hi All,

Got an annoying problem where i have used an example provided by Google, to insert a map into a page and show a marker on it.

That bit works great. What doesn't work great is the fact that the marker is shown in the top left, just outside of the map window and so you have to pan over to be able to see it. What i would like to do is for the map to center on it automatically.

It does seem to center in most desktop browsers however, this map is to be viewed on an iPhone / smartphone and that is where the problem lies. I have found a million + 1 posts about my very problem online but no 'solutions' or 'fixes' seem to actually work for me.

No link but my code is this:

<div data-role="content">  
	<script type="text/javascript">
	  function initialize() {
		var myLatlng = new google.maps.LatLng(51.07381, -1.78605);
		var myOptions = {
		  zoom: 15,
		  center: myLatlng,
		  mapTypeId: google.maps.MapTypeId.ROADMAP
		}
		var map = new google.maps.Map(document.getElementById("property_location"), myOptions);
		var marker = new google.maps.Marker({
			position: myLatlng, 
			center: myLatlng,
			map: map,
			title:"Marker"
		});   
	  }
	</script> 
   	<div id="property_location"></div>
</div><!-- / content -->

Any help would be very much appreciated!

-Jack