title: Table border issue in chrome after jquery drag stop
body: <p><strong>Update</strong> using <code>position: relative:</code> td, th
  then, when dragging</p>
  
  <p><img src="https://i.stack.imgur.com/Dh7iC.jpg" alt="enter image description here"></p>
  
  <p>Table border disappear after jquery drag</p>
  
  <p><img src="https://i.stack.imgur.com/j8W1m.jpg" alt="enter image description here"> </p>
  
  <p>working fine in mozila and ie but not in chrome</p>
  
  <p>jsfiddle <a href="http://jsfiddle.net/YTZrj/" rel="nofollow noreferrer">here</a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;th&gt;id&lt;/th&gt;
          &lt;th&gt;name&lt;/th&gt;
          &lt;th&gt;city&lt;/th&gt;
      &lt;/tr&gt;
        &lt;tr class="person"&gt;
          &lt;td&gt;1&lt;/td&gt;
          &lt;td&gt;abc&lt;/td&gt;
          &lt;td&gt;abc&lt;/td&gt;
      &lt;/tr&gt;
        &lt;tr class="person"&gt;
         &lt;td&gt;2&lt;/td&gt;
          &lt;td&gt;xyz&lt;/td&gt;
          &lt;td&gt;xyz&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>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;
  }
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$('.person').draggable({
      helper : function(){
          return $('&lt;div class="drag"&gt;Drag me&lt;/div&gt;')
      },
      cursor : 'crosshair',
      cursorAt : {left : 50},
      start : function(){
          $(this).hide();
      },
      stop : function(){
            $(this).show();
      }
  });
  </code></pre>