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

Question

我正在使用JQuery对某些div进行排序。

div使用css-rules“margin-left: auto; margin-right: auto;”

在其父div中居中

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

这是一个显示问题的小提琴：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;
}