title: Google maps stays on top left hand corner
body: <p>I want to position Google maps on the bottom of my page, but no matter what numbers I insert, it keeps staying on the top left hand corner and won't budge. I can resize it, but I can't seem to move the positioning. Any help? </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;iframe 
      marginwidth="0" marginheight="0" scrolling="no" width="422" height="300"
      frameborder="0" scrolling="no" 
      src="https://maps.google.ca/maps?ie=UTF8&amp;amp;cid=7805933538308657347&amp;amp;q=Hibiscus&amp;amp;gl=CA&amp;amp;hl=en&amp;amp;t=m&amp;amp;z=16&amp;amp;iwloc=A&amp;amp;output=embed"&gt;
      &lt;/iframe&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>    .iframe  {
      position: absolute; 
      padding-bottom: 65%;
      padding-top: 30px;
      overflow: hidden;
      top: 8000px;
      left: 400px;
      width: 100%;
      height: 100%;
      }        
  </code></pre>