title: CSS fixed position on mobile browsers
body: <p>I'm not sure I can explaint clearly what is the problem, so please be understanding.</p>
  
  <p>I have this HTML code:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div id="navbar"&gt;
          ...
      &lt;/div&gt;
      &lt;div id="content"&gt;
          ...
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is the CSS code:</p>
  
  <pre><code>#container {
      display: block;
      width: 640px;
      height: 480px;
  }
  #navbar {
      display: block;
      position: fixed;
      width: 640px;
      height: 70px;
  }
  #content {
      display: block;
      marign: 70px 0 0 0;
      width: 640px;
      height: 410px;
      overflow-y: auto;
  }
  </code></pre>
  
  <p>It works fine on desktop and any Android-base browser, but in iPhone's Safari... When I zoom in on this page the content works fine, but the fixed element stay on position relative to screen. Every other element moving fine.</p>
  
  <p>What is the problem? I don't have idea...</p>