title: Trying to resize a div to match the width of another div when clicked
body: <p>So here's what I'm working on for reference:</p>
  
  <p><a href="http://www.ryanhammond.us/ellenpaul/index.html" rel="nofollow">http://www.ryanhammond.us/ellenpaul/index.html</a></p>
  
  <p>If you look at the website, you'll see a grid of thumbnails. I used Jquery sortables to allow the thumbnails to be reordered.</p>
  
  <p>All the thumbs are li's in an unordered list which the sortables function is applied to</p>
  
  <pre><code>&lt;script&gt;
    $(function() {
      $( "ul" ).sortable({
        placeholder: "highlight"
      });
      $( "ul" ).disableSelection();
    });
  &lt;/script&gt;
  </code></pre>
  
  <p>My issue is that you specify only one placeholder for all the thumbnails (the placeholder is the light blue square that appears when you drag a thumb - it is .highlight) and I have two different thumbnail widths.     Sooooo if I set .highlight to width 300px it looks great with the 300px width thumbnails, but wrong with the thinner 200px thumbnails.</p>
  
  <p>My best idea so far has been to write up another javascript code that detects the width of a thumbnail when it's clicked and resize the placeholder to that width...  but I'm new with java so I'm not sure if this is the best fix.</p>
  
  <p>Any ideas?  Thanks in advance :)</p>