Expanding compressed div
<p><a href="http://jsfiddle.net/Y8MUF/" rel="nofollow">http://jsfiddle.net/Y8MUF/</a></p>

<p>It can expand the div when i click on it. How do i make it look nicer by adding a "See More" link then hide it when the div exapands and adjust the row height relative to the See More link?</p>

<pre><code>$(document).ready(function(){
 var rowsshown = 2;
 var rowheight = 1.2; // line height in 'em'
 var ht = (rowsshown * rowheight) - .5; // subtracting the .5 prevents the top of the next line from showing
 $('.info')
  .css({'overflow':'hidden','line-height' : rowheight + 'em','height': ht + 'em' })
  .click(function(){
   if ( $(this).css('height') == 'auto') {
    $(this).css('height', ht + 'em');
   } else {
    $(this).css('height','auto');
   }
  });
})
</code></pre>
