停止这个奇怪的jQuery故障

Question

我的问题是我如何解决这个奇怪的小故障在jQuery中。

当我移动其中一个盒子时，它使所有其他盒子向下拍摄，我不知道它为什么发生。有谁知道是什么原因造成这个问题？

这fiddle有我就可以了

JS的所有代码：

$(document).ready(function(){ 
     $(function(){ 
      $('#container').sortable({ 
       connectWith: "#container", 
      cursor: "move" 
     }).disableSelection(); 
    }); 
}); 

的HTML

<div id="container"> 
    <div class="container-item">Item 1</div> 
    <div class="container-item">Item 2</div> 
    <div class="container-item">Item 3</div> 
</div> 

的CSS

lists { 
    height: 200px; 
    width: 300px; 
    border: 1px solid #000000; 
} 

#container { 
    background: lightgrey; 
    width:500px; 
    height: 50px; 
} 
.container-item { 
    display: inline-block; 
    width: 150px; 
    height: 500px; 
    background: lightblue; 
    margin-right: 10px; 
    margin-top: 0; 
    position: relative; 
    max-top: 50px; 
} 

Answer 1

只需添加float: left至.container-item。

Fiddle example