title: Fixed div crashes scroll on page
body: <p>I have a fixed <strong>div</strong> in my <strong>HTML</strong>, and the problem is that I can't <strong>scroll</strong> if that <strong>div</strong> is <strong>fixed</strong>.</p>
  <p>Here is <strong>jsfiddle</strong>: <a href="https://jsfiddle.net/y0kobkny/" rel="nofollow noreferrer">https://jsfiddle.net/y0kobkny/</a></p>
  <h3>HTML</h3>
  <pre><code>&lt;div class=&quot;head&quot;&gt;
  &lt;div class=&quot;head_content&quot;&gt;&lt;/div&gt;
  &lt;br/&gt;
  &lt;br/&gt;
  &lt;br/&gt;
  &lt;br/&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  &lt;p&gt;yfjhgukjhkh&lt;/p&gt;
  </code></pre>
  <h3>CSS</h3>
  <pre><code>.head {
      background-color:rgba(0, 0, 0, 0.72);
      width: 100%;
      height: 10%;
      position:fixed;
      background-repeat: repeat;
      z-index:10;
  }
  </code></pre>