title: webkit-overflow-scrolling: touch with fixed divs
body: <p>I've this small issue, I've created an HTML5 website with ASP.NET where the header is fixed, but on iPad and iPhone it scroll really slow so I had to use this small code in my CSS:</p>
  
  <pre><code>-webkit-overflow-scrolling: touch;
  -webkit-transform: translateZ(0);
  </code></pre>
  
  <p>The scroll issue is gone but the fixed header doesn't work anymore on apple products. But on Windows and Android it works like a charm.</p>
  
  <p>Also I had an autoplay video that plays when its visible and now it doesn't  work anymore on any device.</p>
  
  <p>My code:</p>
  
  <pre><code>&lt;style&gt;
  body, html, form {
      width: 100%;
      height: 100%;
      min-height: 100%;
      overflow-x: hidden;
      -webkit-transform: translateZ(0);
  }
  #wr {
      width: 100%;
      height: 100%;
      -webkit-overflow-scrolling: touch;
  }
  #header .fixed-menu {
      position: fixed;
      width: 100%;
      z-index: 100;
  }
  #header .menu {
      float: right;
      font-family: 'Oswald', sans-serif;
      font-size: 14px;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>Please help (and sorry for my bad English)</p>