title: JQuery UI Sortable Other Rows Shrink while dragging
body: <p>I am using jQuery UI Sortable for reordering the rows. I have 10 (td) columns out of which I show only 6 and remaining 4 are not shown using display:none.</p>
  
  <p>The issues I am facing are </p>
  
  <ol>
  <li><p>In Chrome while dragging all other rows (not the dragged one) columns shrink and then after dropping the row they get expanded to normal size. Why are the rows columns getting shrink while dragging?</p></li>
  <li><p>In IE8 same as above but after dropping the row they are still in the shrink mode and not expanded to normal size.</p></li>
  </ol>
  
  <p>Please find the code below. My issue is the other rows width is getting shrink and not the draggable row. </p>
  
  <pre><code>            this.$('.reportTableBody').sortable({               
              tolerance:"pointer",
              //TODO need to fix
              cursor: 'move',
              revert: 'true',
              helper: function(e, tr)
              {
                  var myHelper = [];
                  myHelper.push('&lt;table style="width: 100%"&gt;');
                  myHelper.push($(tr).html());
                  myHelper.push('&lt;/table&gt;');
                  return myHelper.join('');                   
              },              
              create: function (event, ui) {                  
                   $("td").each(function () {
                          $(this).css("width", $(this).width());
                   });                                         
                  if (jQuery.browser.msie &amp;&amp; Number(jQuery.browser.version) == 8) {
                      this.$('.reportTableBody').sortable("option", "cursorAt", { top: 100 });
                  }
              },
              stop : function(event, ui){                 
                  $(ui.item.parent()).find('tr').each(function(index){
                      $(this).find('.yearSelectCell:first').html(index + 1);
  
                  });                 
                  ui.item.trigger('drop', ui.item.index());                   
              }});                        
  </code></pre>
  
  <p>FYI - some of the columns have display:none which would hide the columns. Do you think because of this the column widths are shrinking ?</p>