title: Fix Safari Loading Iframe Zoomed In
body: <p>EDIT: Simplified the question:</p>
  
  <p>I have a 100% width "seamless" <code>iframe</code> in which I embed another (local) page.</p>
  
  <p>When accessing the page directly on Safari, the contents are properly zoomed out to fit the screen.
  However when the website is in an <code>iframe</code>, the page loads zoomed in and I have to zoom out manually in order to see it in full width. Is there a workaround for this?</p>
  
  <p>Iframe code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;title&gt;iFrame&lt;/title&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
          &lt;style&gt;
              body, html, iframe
              {
                  height: 100%;
                  margin: 0;
                  padding: 0;
              }
  
              iframe
              {
                  width: 100%;
                  display: block;
              }
          &lt;/style&gt;
      &lt;/head&gt;
  
      &lt;body&gt;
          &lt;iframe src="index.html"&gt;&lt;/iframe&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>