jquery sortable border collapse chrome safari

Question

I'm using jQuery sortable() on a table with border-collapse: collapse. Something strange happens with the spacing between the rows in Chrome and Safari. It seems ok in IE, FF, & Opera.

Here is an example: http://jsfiddle.net/benstenson/LMqNH/

1. border-collapse: separate is one option.

2. Calling $('table').hide.show(0) on the sortable() stop event is another option.

Anyone know what the problem is?

Here is a screenshot after moving the rows around.

Answer 1

I've been working on this for a while. The closest I've been able to achieve is this:

http://jsfiddle.net/rogerblanton/EtC2E/1/

I changed a little bit of the CSS to put the border on something different and it looks pretty close if not exactly what you want.

Hope it helps.