title: make image element fixed position and doesn't move on scroll
body: <p>I am trying to make an image stick to left of the page like "Give Feedback" button in:</p>
  
  <p><a href="http://www.hotscripts.com/category/scripts/php/" rel="nofollow">http://www.hotscripts.com/category/scripts/php/</a></p>
  
  <p>I have the following HTML code ( i have other codes but just to show an example):</p>
  
  <pre><code>&lt;img id="btn" class="btn" src="cl.png" height="161" width="34" alt="clear" /&gt;
  </code></pre>
  
  <p>and the following CSS:</p>
  
  <pre><code>#btn {
      display: block;
      position: fixed;
      left: 0;
      top: 54%;
      z-index: 100001;
      width: 34px;
      height: 168px;
      margin: -45px 0 0;
      padding: 0;
      cursor: pointer;
  }
  </code></pre>
  
  <p>For some reason it's not producing the same effect when I scroll the page. Do I have to use another DIV and wrap the button?</p>