title: jquery sortable + non selected li elements moving
body: <p>This is the way the ul/li structure looks:</p>
  
  <p><img src="https://i.stack.imgur.com/PtQMi.png" alt="enter image description here"></p>
  
  <p>When I move items around this structure remains in place for FF &amp; Chrome but in IE I get the following:</p>
  
  <p><img src="https://i.stack.imgur.com/UA9Ph.png" alt="enter image description here"></p>
  
  <p>Basically the moving item seems to push the items below down.</p>
  
  <p>This is the HTML structure:</p>
  
  <pre><code>&lt;ul id="photoPreviews&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;li&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>And this is the CSS:</p>
  
  <pre><code>ul#photoPreviews {
      position: absolute;
      top: 350px;
      left: 39px;
      list-style-type: none;
      width: 310px;
      height: 170px;
  }
  
  ul#photoPreviews li {
      float: left;
      display: inline;
  }
  </code></pre>
  
  <p>How can I prevent the IE structure changing when I sort li's? 
  Note: I'm using IE9.</p>
  
  <p>thankyou.</p>