title: Internal anchor Position on firefox mobile (on android)
body: <p>I have a homepage with a number of sections - each of these is linked to from the main menu:</p>
  
  <pre><code>&lt;body&gt;
      &lt;header&gt;
          &lt;!-- nav used on all pages --&gt;
          &lt;a href="#nav" class="toggle-nav"&gt;
              menu &lt;i class="fa fa-bars"&gt;&lt;/i&gt;
          &lt;/a&gt;
          &lt;nav class="main-nav" id="nav"&gt;
              &lt;a href="/#item1"&gt;Link&lt;/a&gt;
              &lt;a href="/#item2"&gt;Link&lt;/a&gt;
          &lt;/nav&gt;
      &lt;/header&gt;
  
  
      &lt;!-- homepage --&gt;
      &lt;main&gt;
          &lt;section id="item1"&gt;some content here &lt;/section&gt;
          &lt;section id="item2"&gt;some other content here &lt;/section&gt;
      &lt;/main&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>(possibly) relevant css:</p>
  
  <pre><code>body {
      position: relative;
      overflow-x: hidden;
  }
  
  @media only screen and (max-width: 750px) {
      header .main-nav a {
          display: block;
      }
  
      .tiggle-nav {
          display: none;
      }
  }
  </code></pre>
  
  <p>The idea is that I should be able to click on 'Item 1' in the menu across the entire site, and land at that particular section of the homepage.</p>
  
  <p>This works really well, <em>except</em> on firefox mobile, where the clicking on the homepage internal anchor link <strong>from any other internal page</strong> will result in the homepage loading anywhere between 100 and 200px away from the intended location.</p>
  
  <p>Interestingly, if I refresh the page <em>after</em> the homepage has initially loaded, firefox mobile can find the internal anchor with no problems - i.e this is only a problem when navigating from the internal page to the homepage.</p>
  
  <p>What is happening here? Does this have something to do with firefox mobile not loading CSS until <em>after</em> it has found the internal anchor?</p>
  
  <p>And importantly, how can I make firefox mobile find the correct location first time?</p>
  
  <p>Any insights very much appreciated.</p>
  
  <p>Full css and html is live at <a href="http://whoisnicoleharris.com" rel="noreferrer">http://whoisnicoleharris.com</a></p>