JQuery可以用居中元素排序吗？

Question

我正在对一些 div 使用可排序的 JQuery。

div 在其父 div 中居中，css 规则为“margin-left: auto; margin-right: auto;”

问题：当我拖动一个元素时，它会跳到左侧，因为边距不再起作用。

这是一个显示问题的小提琴：http://jsfiddle.net/annam/35MC3/28/

我该如何解决，让元素始终居中？

Answer 1

我可能会这样做：

http://jsfiddle.net/Ddymf/

添加一个额外的容器，使项目居中，这样排序项就不需要对齐。

<div id="outerContainer">
    <div id="container">
        <div class="draggable"></div>
        <div class="draggable"></div>
    </div>
</div>

...

#outerContainer {
    width: 200px;
    text-align: center;
    height: 300px;
    border: 1px solid green;
    position: relative;
}
#container {
    width: 100px;
    margin:0 auto;
}
.draggable {
    width: 100px;
    height: 100px;
    background: yellow;
    margin: 10px auto;
    cursor: move;
}