title: Have floating div hug right side and accommodate scrollbar
body: <p>I've been trying to find a solution to this, but I dont know if maybe Im not wording it correctly because I can't seem to find an answer.</p>
  
  <p>I have a page with a 'quick links' button which is designed to float against the right hand side of the screen while scrolling.</p>
  
  <p>I have used the following to get the effect (the right attriubte is to hide the menu which shows when you click on the element.) </p>
  
  <pre><code>#quickLinks {
      position: fixed;
      display: block;
      top: 50%;
      z-index: 2;
      right: -250px;
  }
  </code></pre>
  
  <p>This is all working pretty fine, but I've found that im struggling to accomodate when a scroll bar is present or not.</p>
  
  <p>So ive added a bit of 'padding' to the right attribute to stick out a little when there is a scroll bar (which my page generally has), but since there is no scroll bar visible on an ipad, for instance, there is that padded gap.</p>
  
  <p>Ive noticed that using 'absolute' rather than fixed seems to get the hugging effect right, but then I lose the floating scroll.</p>
  
  <p>Any ideas or suggestions would be greatly appreciated. :)</p>
  
  <p>thanks! </p>