title: Fixed <thead> in <table>
body: <pre><code>&lt;table border="1" style="height:50px; overflow:auto;"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th&gt;Col 1
        &lt;/th&gt;
        &lt;th&gt;Col 2
        &lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td&gt;Cell 3
        &lt;/td&gt;
        &lt;td&gt;Cell 4
        &lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td&gt;Cell 5
        &lt;/td&gt;
        &lt;td&gt;Cell 6
        &lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I'd like the above table to be of 50px height so the scrollers would kick in when the content grows, but I'd also like table headers (thead) to be fixed always on top, while other content can be scrollable. Is there an solution, preferable using jQuery?</p>
  
  <p>Thanks in advance for your help.</p>