Google maps Iframes

Get Started
1

Hello this is my code and I cannot figure out, why my map wont move to the desired location in the in the middle

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
<title>Untitled Document</title>
<style type=“text/css”>

html, body {height:100%;margin:0;padding:0;}
body {
background:#fff;
color:#000;
font-size:13px;
font-family: Arial, Helvetica, sans-serif;
background-image:url(‘backgtround2.jpg’);
background-repeat: no-repeat;
background-position:50% 0px;
background-color:#969696;

</style>
</head>

<body>
<div id=“iframe”>
</br>
<iframe width=“300” height=“300” frameborder=“0” scrolling=“no” marginheight=“1” marginwidth=“0” src=“http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Cv10+7xx&amp;aq=&amp;sll=51.510538,-0.595041&amp;sspn=0.182691,0.528374&amp;ie=UTF8&amp;hq=&amp;hnear=CV10,+United+Kingdom&amp;t=m&amp;ll=52.532827,-1.519203&amp;spn=0.031327,0.051498&amp;z=13&amp;iwloc=A&amp;output=embed”></iframe>

</div>
</body>
</html>

2

Aziz09,

In your CSS code, you need to reference the hook that you have on your div surrounding the iframe. The code would look something like this

#iframe {
margin-right:auto;
margin-left:auto;
}

Note that you will need to define the height and width of the div in order to center it. By default it is going to be the width of the page and therefore nothing will appear to have happened if you center it without defining a width.
Alternatively you could do this

<p align=”center”><iframe>your iframe</iframe></p>

Hope that helps,

Shawn