title: jQuery UI Drag & Drop
body: <p>I tried using the solution posted here: <a href="https://stackoverflow.com/questions/811037/jquery-draggable-and-overflow-issue">jQuery Draggable and overflow issue</a>, but I can't seem to get it to work for myself. I have a container div (div#container) which wraps around all of my draggable divs. The div#container has its overflow set to auto. I've used the scroll option and set it to false, but it still scrolls. Any ideas?</p>
  
  <p>My HTML:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
      &lt;div class="draggable"&gt; Drag Me &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My CSS:</p>
  
  <pre><code>div#container {
      width: 300px;
      height: 300px;
      overflow: auto;
  }
  
  div.draggable {
      padding: 3px;
      font-size: 1.4em;
  }
  </code></pre>
  
  <p>My Javascript:</p>
  
  <pre><code>$(function(){
      $(".draggable").draggable({ 
          scroll: false 
      });
  });
  </code></pre>