title: CSS Table Column Freeze
body: <p>Could someone help with this</p>
  
  <p><a href="http://jsfiddle.net/smilepak/8qRQB/4/" rel="nofollow">http://jsfiddle.net/smilepak/8qRQB/4/</a></p>
  
  <pre><code>&lt;div&gt;
  &lt;table&gt;
      &lt;tr&gt;
          &lt;td class="headcol"&gt;Fiddle Options&lt;/td&gt;
          &lt;td class="long"&gt;Created and maintained by Piotr and Oskar. Hosted by DigitalOcean. Special thanks to MooTools community.&lt;/td&gt;
          &lt;td class="long"&gt;QWERTYUIOPASDFGHJKLZXCVBNM&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td class="headcol"&gt;Legal, Credits and Links&lt;/td&gt;
          &lt;td class="long" style="width:300px"&gt;QWERTYUIOPASDFGHJKLZXCVBNM&lt;/td&gt;
          &lt;td class="long" style="width:300px"&gt;QWERTYUIOPASDFGHJKLZXCVBNM&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td class="headcol"&gt;Ajax Requests&lt;/td&gt;
          &lt;td class="long"&gt;QWERTYUIOPASDFGHJKLZXCVBNM&lt;/td&gt;
          &lt;td class="long"&gt;QWERTYUIOPASDFGHJKLZXCVBNM&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>        table {
          border-collapse:separate;
          border-top: 1px solid grey;
      }
      td {
          margin:0;
          border:1px solid grey;
          border-top-width:0px;
      }
      div {
          width: 600px;
          overflow-x:scroll;
          margin-left:10em;
          overflow-y:visible;
          padding-bottom:1px;
      }
      .headcol {
          position:absolute;
          width:10em;
          left:0;
          top:auto;
          border-right: 1px none black;
          border-top-width:1px;
          /*only relevant for first row*/
          margin-top:-3px;
          /*compensate for top border*/
      }
  </code></pre>
  
  <p>In firefox, the row border doesn't seem to line up. I want a table where the first column is frozen while the rest is scrollable. All rows are linked up to a single scroll bar so i can use in a loop via Razor view in MVC. </p>
  
  <p>Thanks,</p>