在jquery拖动停止之后在铬的表边界问题

Question

使用position: relative: td，

更新 然后，拖动时

jquery拖动后表边框消失

在mozila工作正常，但不是在铬中

jsfiddle here

HTML

<table>
    <tr>
        <th>id</th>
        <th>name</th>
        <th>city</th>
    </tr>
      <tr class="person">
        <td>1</td>
        <td>abc</td>
        <td>abc</td>
    </tr>
      <tr class="person">
       <td>2</td>
        <td>xyz</td>
        <td>xyz</td>
    </tr>
</table>

CSS

table{
    border-collapse : collapse;
}

td, th{
    border : 1px solid #000;
    padding : 5px 20px;
}

th{
    background-color : #f3f3f3;
}

.drag {
    background-color : #f3f3f3;
    height : 20px;
    width : 100px;
}

JS

$('.person').draggable({
    helper : function(){
        return $('<div class="drag">Drag me</div>')
    },
    cursor : 'crosshair',
    cursorAt : {left : 50},
    start : function(){
        $(this).hide();
    },
    stop : function(){
          $(this).show();
    }
});

Answer 1

从表css中删除border-collapse似乎已经成功了。

table{
      /* border-collapse : collapse */
}

查看http://jsfiddle.net/YTZrj/1/

Answer 2

table {border-collapse:separate;} 

会使表格看起来有点不同，但不会再出现此问题。

http://jsfiddle.net/YTZrj/4/