How do I create an HTML table with a fixed frozen left column and a scrollable body

Question

I need a simple solution  I know it s similar to some other questions  like    HTML table with fixed headers and a fixed column  How can I lock the first row and first column of a table when scrolling  possibly using JavaScript and CSS    But I need just a single left column to be frozen and I would prefer a simple and script-less solution

User · Answer

Eamon Nerbonne  I changed some css in your code and it s better now the scroll bar starts from the first row   http   jsfiddle net At8L8   I just add two line     div   padding-left 5em   headcol   background-color    fff

User · Answer

This is an interesting jQuery plugin that creates fixed headers and or columns  Toggle fixed column to be true on the demo page to see it in action

User · Answer

You can use sticky position  Here is a sample code  This is HTML CSS solution  No js is required   x000D   x000D   view     margin  auto    width  600px      wrapper     position  relative    overflow  auto    border  1px solid black    white-space  nowrap      sticky-col     position  -webkit-sticky    position  sticky    background-color  white      first-col     width  100px    min-width  100px    max-width  100px    left  0px      second-col     width  150px    min-width  150px    max-width  150px    left  100px    x000D   lt div class  view  gt     lt div class  wrapper  gt       lt table class  table  gt         lt thead gt           lt tr gt             lt th class  sticky-col first-col  gt Number lt  th gt             lt th class  sticky-col second-col  gt First Name lt  th gt             lt th gt Last Name lt  th gt             lt th gt Employer lt  th gt           lt  tr gt         lt  thead gt         lt tbody gt           lt tr gt             lt td class  sticky-col first-col  gt 1 lt  td gt             lt td class  sticky-col second-col  gt Mark lt  td gt             lt td gt Ham lt  td gt             lt td gt Micro lt  td gt           lt  tr gt           lt tr gt             lt td class  sticky-col first-col  gt 2 lt  td gt             lt td class  sticky-col second-col  gt Jacob lt  td gt             lt td gt Smith lt  td gt             lt td gt Adob Adob Adob AdobAdob Adob Adob Adob Adob lt  td gt           lt  tr gt           lt tr gt             lt td class  sticky-col first-col  gt 3 lt  td gt             lt td class  sticky-col second-col  gt Larry lt  td gt             lt td gt Wen lt  td gt             lt td gt Goog Goog Goog GoogGoog Goog Goog Goog Goog Goog lt  td gt           lt  tr gt         lt  tbody gt       lt  table gt     lt  div gt   lt  div gt  x000D   x000D   x000D   Bootply code  https   www bootply com g8pfBXOcY9

User · Answer

You can just make the first column position  sticky  z-index  9  It will make the column row stick to its current position  Checkout my example codepen here https   codepen io swastikmishra pen zYYdKBQ  HTML Example   lt style type  text css  gt              table  text-align  center                 table-container  width  500px  height  300px  overflow  scroll               table th  table td                   white-space  nowrap                  padding  10px 20px                  font-family  Arial                            table tr th first-child  table td first-child                  position  sticky                  width  100px                  left  0                  z-index  10                  background   fff                            table tr th first-child                  z-index  11                            table tr th                  position  sticky                  top  0                  z-index  9                  background   fff                         lt  style gt           lt div class  table-container  gt               lt table gt                   lt tr gt  lt th gt Hello World lt  th gt  lt th gt Hello World lt  th gt  lt th gt Hello World lt  th gt  lt th gt Hello World lt  th gt  lt th gt Hello World lt  th gt  lt th gt Hello World lt  th gt  lt th gt Hello World lt  th gt  lt  tr gt                   lt tr gt  lt td gt H11 lt  td gt  lt td gt H12 lt  td gt  lt td gt H13 lt  td gt  lt td gt H14 lt  td gt  lt td gt H15 lt  td gt  lt td gt H16 lt  td gt  lt td gt H17 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H21 lt  td gt  lt td gt H22 lt  td gt  lt td gt H23 lt  td gt  lt td gt H24 lt  td gt  lt td gt H25 lt  td gt  lt td gt H26 lt  td gt  lt td gt H27 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H31 lt  td gt  lt td gt H32 lt  td gt  lt td gt H33 lt  td gt  lt td gt H34 lt  td gt  lt td gt H35 lt  td gt  lt td gt H36 lt  td gt  lt td gt H37 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H41 lt  td gt  lt td gt H42 lt  td gt  lt td gt H44 lt  td gt  lt td gt H44 lt  td gt  lt td gt H45 lt  td gt  lt td gt H46 lt  td gt  lt td gt H47 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H51 lt  td gt  lt td gt H52 lt  td gt  lt td gt H54 lt  td gt  lt td gt H54 lt  td gt  lt td gt H55 lt  td gt  lt td gt H56 lt  td gt  lt td gt H57 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H61 lt  td gt  lt td gt H62 lt  td gt  lt td gt H64 lt  td gt  lt td gt H64 lt  td gt  lt td gt H65 lt  td gt  lt td gt H66 lt  td gt  lt td gt H67 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H71 lt  td gt  lt td gt H72 lt  td gt  lt td gt H74 lt  td gt  lt td gt H74 lt  td gt  lt td gt H75 lt  td gt  lt td gt H76 lt  td gt  lt td gt H77 lt  td gt  lt  tr gt                   lt tr gt  lt td gt H81 lt  td gt  lt td gt H82 lt  td gt  lt td gt H84 lt  td gt  lt td gt H84 lt  td gt  lt td gt H85 lt  td gt  lt td gt H86 lt  td gt  lt td gt H87 lt  td gt  lt  tr gt               lt  table gt           lt  div gt

User · Answer

Alternatively  style the tbody with a predetermined size  via height 20em  for example  and use overflow-y scroll   Then  you can have a huge tbody  which will scroll independently of the rest of the page

User · Answer

If you re developing something more complicated and want multiple columns to be fixed stuck to the left  you ll probably need something like this    x000D   x000D   wrapper   x000D      overflow-x  scroll  x000D    x000D   x000D  td   x000D      min-width  50px  x000D    x000D   x000D   fixed   x000D      position  absolute  x000D      background   aaa  x000D    x000D   lt div class  content  style  width  400px  gt  x000D   x000D     lt div class  wrapper  style  margin-left  100px  gt  x000D   x000D         lt table gt  x000D           lt thead gt  x000D             lt tr gt  x000D               lt th class  fixed  style  left  0px  gt aaa lt  th gt  x000D               lt th class  fixed  style  left  50px  gt aaa2 lt  th gt  x000D               lt th gt a lt  th gt  x000D               lt th gt b lt  th gt  x000D               lt th gt c lt  th gt  x000D               lt th gt d lt  th gt  x000D               lt th gt e lt  th gt  x000D               lt th gt f lt  th gt  x000D               lt th gt a lt  th gt  x000D               lt th gt b lt  th gt  x000D               lt th gt c lt  th gt  x000D               lt th gt d lt  th gt  x000D               lt th gt e lt  th gt  x000D               lt th gt f lt  th gt  x000D               lt th gt a lt  th gt  x000D               lt th gt b lt  th gt  x000D               lt th gt c lt  th gt  x000D               lt th gt d lt  th gt  x000D               lt th gt e lt  th gt  x000D               lt th gt f lt  th gt  x000D               lt th gt a lt  th gt  x000D               lt th gt b lt  th gt  x000D               lt th gt c lt  th gt  x000D               lt th gt d lt  th gt  x000D               lt th gt e lt  th gt  x000D               lt th gt f lt  th gt          x000D             lt  tr gt  x000D           lt  thead gt  x000D           lt tbody gt  x000D             lt tr gt  x000D               lt td class  fixed  style  left  0px  gt aaa lt  td gt  x000D               lt td class  fixed  style  left  50px  gt aaa2 lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D             lt  tr gt  x000D             lt tr gt  x000D               lt td class  fixed  style  left  0  gt bbb lt  td gt  x000D               lt td class  fixed  style  left  50px  gt bbb2 lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D               lt td gt a lt  td gt  x000D               lt td gt b lt  td gt  x000D               lt td gt c lt  td gt  x000D               lt td gt d lt  td gt  x000D               lt td gt e lt  td gt  x000D               lt td gt f lt  td gt  x000D             lt  tr gt  x000D           lt  tbody gt  x000D         lt  table gt  x000D   x000D     lt  div gt  x000D   x000D   lt  div gt  x000D   x000D   x000D

User · Answer

Opera was buggy for all of the previous answers when I tested them on my mac   If you scroll through the table the fixed column disappears after you pass the first unfixed column  I went ahead and wrote the code below  It works in all the browsers I have locally installed  I don t know how ie handles it though   Just keep that in mind that if you intend to skip rows in one table and not the other or change the heights of the rows you might need to adjust this code    lt table class    fixedColumns  gt       lt tr gt  lt td gt  row 1  lt  td gt  lt  tr gt       lt tr gt  lt td gt  row 2  lt  td gt  lt  tr gt   lt  table gt   lt table class    scrollableTable  gt       lt tr gt  lt td gt  col 1  lt  td gt   lt td gt  col 2  lt  td gt  lt td gt  col 3  lt  td gt  lt td gt  col 4  lt  td gt  lt  tr gt       lt tr gt  lt td gt  col 1  lt  td gt   lt td gt  col 2  lt  td gt  lt td gt  col 3  lt  td gt  lt td gt  col 4  lt  td gt  lt  tr gt   lt  table gt    lt style type    text css   gt       fixedColumns               vertical-align top          display  inline-block             scrollableTable               display  inline-block          width 50px          white-space  nowrap          overflow-x  scroll         lt  style gt

User · Answer

Add this in the head    lt link rel  stylesheet  type  text css  href   path to easyscrolltable css  gt   lt script src   path to easyscrolltable js  gt  lt  script gt    Javascript      table ytable   EasyScrollableTable        top     1         left    1         class            width    100         height    auto        footer   false       hover   true

User · Answer

A little late but I did run across this thread when trying out solutions for myself  Assuming you re using modern browsers nowadays  I came up with a solution using CSS calc   to help guarantee widths met up    x000D   x000D   table-fixed-left table  x000D   table-fixed-right table   x000D    border-collapse  collapse  x000D    x000D   table-fixed-right td  x000D   table-fixed-right th  x000D   table-fixed-left td  x000D   table-fixed-left th   x000D    border  1px solid  ddd  x000D    padding  5px 5px  x000D    x000D   table-fixed-left   x000D    width  120px  x000D    float  left  x000D    position  fixed  x000D    overflow-x  scroll  x000D    white-space  nowrap  x000D    text-align  left  x000D    border  1px solid  ddd  x000D    z-index  2  x000D    x000D   table-fixed-right   x000D    width  calc 100  - 145px   x000D    right  15px  x000D    position  fixed  x000D    overflow-x  scroll  x000D    border  1px solid  ddd  x000D    white-space  nowrap  x000D    x000D   table-fixed-right td  x000D   table-fixed-right th   x000D    padding  5px 10px  x000D    x000D   lt div class  table-fixed-left  gt  x000D     lt table gt  x000D       lt tr gt  x000D         lt th gt Normal Header lt  th gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt th gt Header with extra line x000D           lt br  gt  amp nbsp  lt  th gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt th gt Normal Header lt  th gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt th gt Normal with extra line x000D           lt br  gt  amp nbsp  lt  th gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt th gt Normal Header lt  th gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt th gt Normal Header lt  th gt  x000D       lt  tr gt  x000D     lt  table gt  x000D   lt  div gt  x000D   lt div class  table-fixed-right  gt  x000D     lt table gt  x000D       lt tr gt  x000D         lt th gt Header lt  th gt  x000D         lt th gt Another header lt  th gt  x000D         lt th gt Header lt  th gt  x000D         lt th gt Header really really really really long lt  th gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt td gt Info Long lt  td gt  x000D         lt td gt Info x000D           lt br  gt with second line lt  td gt  x000D         lt td gt Info x000D           lt br  gt with second line lt  td gt  x000D         lt td gt Info Long lt  td gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt td gt Info Long lt  td gt  x000D         lt td gt Info Long lt  td gt  x000D         lt td gt Info Long lt  td gt  x000D         lt td gt Info Long lt  td gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt td gt Info x000D           lt br  gt with second line lt  td gt  x000D         lt td gt Info x000D           lt br  gt with second line lt  td gt  x000D         lt td gt Info x000D           lt br  gt with second line lt  td gt  x000D         lt td gt Info lt  td gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt td gt Info lt  td gt  x000D         lt td gt Info lt  td gt  x000D         lt td gt Info lt  td gt  x000D         lt td gt Info lt  td gt  x000D       lt  tr gt  x000D       lt tr gt  x000D         lt td gt Info lt  td gt  x000D         lt td gt Info lt  td gt  x000D         lt td gt Info lt  td gt  x000D         lt td gt Info lt  td gt  x000D       lt  tr gt  x000D     lt  table gt  x000D   lt  div gt  x000D   x000D   x000D    Hope this helps someone

User · Answer

x000D   x000D    document  ready function     x000D      var table       example   DataTable    x000D          scrollY          400px   x000D          scrollX         true  x000D          scrollCollapse  true  x000D          paging          true  x000D          fixedColumns      x000D              leftColumns  3 x000D            x000D           x000D       x000D   lt head gt  x000D    lt title gt table lt  title gt  x000D    x000D   lt script src  https   ajax googleapis com ajax libs jquery 3 3 1 jquery min js  gt  lt  script gt  x000D   lt link rel  stylesheet  href  https   cdn datatables net 1 10 16 css jquery dataTables min css  gt  x000D   lt link rel  stylesheet  href  https   cdn datatables net fixedcolumns 3 2 4 css fixedColumns dataTables min css  gt  x000D   lt script type  text javascript  src  http   cdn datatables net 1 10 2 js jquery dataTables min js  gt  lt  script gt  x000D   lt script type  text javascript  src  https   code jquery com jquery-1 12 4 js  gt  lt  script gt  x000D   lt script type  text javascript  src  https   cdn datatables net 1 10 16 js jquery dataTables min js  gt  lt  script gt  x000D   lt script type  text javascript  src  https   cdn datatables net fixedcolumns 3 2 4 js dataTables fixedColumns min js  gt  lt  script gt  x000D   x000D   x000D   lt style gt  x000D         th  td   white-space  nowrap    x000D      div dataTables wrapper   x000D          width  900px  x000D          margin  0 auto  x000D        x000D   lt  style gt  x000D   x000D   lt  head gt  x000D   lt table id  example  class  stripe row-border order-column  style  width 100   gt  x000D           lt thead gt  x000D               lt tr gt  x000D                   lt th gt First name lt  th gt  x000D                   lt th gt Last name lt  th gt  x000D                   lt th gt Position lt  th gt  x000D                   lt th gt Office lt  th gt  x000D                   lt th gt Age lt  th gt  x000D                   lt th gt Start date lt  th gt  x000D                   lt th gt Salary lt  th gt  x000D                   lt th gt Extn  lt  th gt  x000D                   lt th gt E-mail lt  th gt  x000D               lt  tr gt  x000D           lt  thead gt  x000D           lt tbody gt  x000D               lt tr gt  x000D                   lt td gt Tiger lt  td gt  x000D                   lt td gt Nixon lt  td gt  x000D                   lt td gt System Architect lt  td gt  x000D                   lt td gt Edinburgh lt  td gt  x000D                   lt td gt 61 lt  td gt  x000D                   lt td gt 2011 04 25 lt  td gt  x000D                   lt td gt  320 800 lt  td gt  x000D                   lt td gt 5421 lt  td gt  x000D                   lt td gt t nixon datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Garrett lt  td gt  x000D                   lt td gt Winters lt  td gt  x000D                   lt td gt Accountant lt  td gt  x000D                   lt td gt Tokyo lt  td gt  x000D                   lt td gt 63 lt  td gt  x000D                   lt td gt 2011 07 25 lt  td gt  x000D                   lt td gt  170 750 lt  td gt  x000D                   lt td gt 8422 lt  td gt  x000D                   lt td gt g winters datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Ashton lt  td gt  x000D                   lt td gt Cox lt  td gt  x000D                   lt td gt Junior Technical Author lt  td gt  x000D                   lt td gt San Francisco lt  td gt  x000D                   lt td gt 66 lt  td gt  x000D                   lt td gt 2009 01 12 lt  td gt  x000D                   lt td gt  86 000 lt  td gt  x000D                   lt td gt 1562 lt  td gt  x000D                   lt td gt a cox datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Cedric lt  td gt  x000D                   lt td gt Kelly lt  td gt  x000D                   lt td gt Senior Javascript Developer lt  td gt  x000D                   lt td gt Edinburgh lt  td gt  x000D                   lt td gt 22 lt  td gt  x000D                   lt td gt 2012 03 29 lt  td gt  x000D                   lt td gt  433 060 lt  td gt  x000D                   lt td gt 6224 lt  td gt  x000D                   lt td gt c kelly datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Airi lt  td gt  x000D                   lt td gt Satou lt  td gt  x000D                   lt td gt Accountant lt  td gt  x000D                   lt td gt Tokyo lt  td gt  x000D                   lt td gt 33 lt  td gt  x000D                   lt td gt 2008 11 28 lt  td gt  x000D                   lt td gt  162 700 lt  td gt  x000D                   lt td gt 5407 lt  td gt  x000D                   lt td gt a satou datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Brielle lt  td gt  x000D                   lt td gt Williamson lt  td gt  x000D                   lt td gt Integration Specialist lt  td gt  x000D                   lt td gt New York lt  td gt  x000D                   lt td gt 61 lt  td gt  x000D                   lt td gt 2012 12 02 lt  td gt  x000D                   lt td gt  372 000 lt  td gt  x000D                   lt td gt 4804 lt  td gt  x000D                   lt td gt b williamson datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Herrod lt  td gt  x000D                   lt td gt Chandler lt  td gt  x000D                   lt td gt Sales Assistant lt  td gt  x000D                   lt td gt San Francisco lt  td gt  x000D                   lt td gt 59 lt  td gt  x000D                   lt td gt 2012 08 06 lt  td gt  x000D                   lt td gt  137 500 lt  td gt  x000D                   lt td gt 9608 lt  td gt  x000D                   lt td gt h chandler datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Rhona lt  td gt  x000D                   lt td gt Davidson lt  td gt  x000D                   lt td gt Integration Specialist lt  td gt  x000D                   lt td gt Tokyo lt  td gt  x000D                   lt td gt 55 lt  td gt  x000D                   lt td gt 2010 10 14 lt  td gt  x000D                   lt td gt  327 900 lt  td gt  x000D                   lt td gt 6200 lt  td gt  x000D                   lt td gt r davidson datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Colleen lt  td gt  x000D                   lt td gt Hurst lt  td gt  x000D                   lt td gt Javascript Developer lt  td gt  x000D                   lt td gt San Francisco lt  td gt  x000D                   lt td gt 39 lt  td gt  x000D                   lt td gt 2009 09 15 lt  td gt  x000D                   lt td gt  205 500 lt  td gt  x000D                   lt td gt 2360 lt  td gt  x000D                   lt td gt c hurst datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Sonya lt  td gt  x000D                   lt td gt Frost lt  td gt  x000D                   lt td gt Software Engineer lt  td gt  x000D                   lt td gt Edinburgh lt  td gt  x000D                   lt td gt 23 lt  td gt  x000D                   lt td gt 2008 12 13 lt  td gt  x000D                   lt td gt  103 600 lt  td gt  x000D                   lt td gt 1667 lt  td gt  x000D                   lt td gt s frost datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Jena lt  td gt  x000D                   lt td gt Gaines lt  td gt  x000D                   lt td gt Office Manager lt  td gt  x000D                   lt td gt London lt  td gt  x000D                   lt td gt 30 lt  td gt  x000D                   lt td gt 2008 12 19 lt  td gt  x000D                   lt td gt  90 560 lt  td gt  x000D                   lt td gt 3814 lt  td gt  x000D                   lt td gt j gaines datatables net lt  td gt  x000D               lt  tr gt  x000D                lt tr gt  x000D                   lt td gt Sakura lt  td gt  x000D                   lt td gt Yamamoto lt  td gt  x000D                   lt td gt Support Engineer lt  td gt  x000D                   lt td gt Tokyo lt  td gt  x000D                   lt td gt 37 lt  td gt  x000D                   lt td gt 2009 08 19 lt  td gt  x000D                   lt td gt  139 575 lt  td gt  x000D                   lt td gt 9383 lt  td gt  x000D                   lt td gt s yamamoto datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Thor lt  td gt  x000D                   lt td gt Walton lt  td gt  x000D                   lt td gt Developer lt  td gt  x000D                   lt td gt New York lt  td gt  x000D                   lt td gt 61 lt  td gt  x000D                   lt td gt 2013 08 11 lt  td gt  x000D                   lt td gt  98 540 lt  td gt  x000D                   lt td gt 8327 lt  td gt  x000D                   lt td gt t walton datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Finn lt  td gt  x000D                   lt td gt Camacho lt  td gt  x000D                   lt td gt Support Engineer lt  td gt  x000D                   lt td gt San Francisco lt  td gt  x000D                   lt td gt 47 lt  td gt  x000D                   lt td gt 2009 07 07 lt  td gt  x000D                   lt td gt  87 500 lt  td gt  x000D                   lt td gt 2927 lt  td gt  x000D                   lt td gt f camacho datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Serge lt  td gt  x000D                   lt td gt Baldwin lt  td gt  x000D                   lt td gt Data Coordinator lt  td gt  x000D                   lt td gt Singapore lt  td gt  x000D                   lt td gt 64 lt  td gt  x000D                   lt td gt 2012 04 09 lt  td gt  x000D                   lt td gt  138 575 lt  td gt  x000D                   lt td gt 8352 lt  td gt  x000D                   lt td gt s baldwin datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Zenaida lt  td gt  x000D                   lt td gt Frank lt  td gt  x000D                   lt td gt Software Engineer lt  td gt  x000D                   lt td gt New York lt  td gt  x000D                   lt td gt 63 lt  td gt  x000D                   lt td gt 2010 01 04 lt  td gt  x000D                   lt td gt  125 250 lt  td gt  x000D                   lt td gt 7439 lt  td gt  x000D                   lt td gt z frank datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Zorita lt  td gt  x000D                   lt td gt Serrano lt  td gt  x000D                   lt td gt Software Engineer lt  td gt  x000D                   lt td gt San Francisco lt  td gt  x000D                   lt td gt 56 lt  td gt  x000D                   lt td gt 2012 06 01 lt  td gt  x000D                   lt td gt  115 000 lt  td gt  x000D                   lt td gt 4389 lt  td gt  x000D                   lt td gt z serrano datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Jennifer lt  td gt  x000D                   lt td gt Acosta lt  td gt  x000D                   lt td gt Junior Javascript Developer lt  td gt  x000D                   lt td gt Edinburgh lt  td gt  x000D                   lt td gt 43 lt  td gt  x000D                   lt td gt 2013 02 01 lt  td gt  x000D                   lt td gt  75 650 lt  td gt  x000D                   lt td gt 3431 lt  td gt  x000D                   lt td gt j acosta datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Cara lt  td gt  x000D                   lt td gt Stevens lt  td gt  x000D                   lt td gt Sales Assistant lt  td gt  x000D                   lt td gt New York lt  td gt  x000D                   lt td gt 46 lt  td gt  x000D                   lt td gt 2011 12 06 lt  td gt  x000D                   lt td gt  145 600 lt  td gt  x000D                   lt td gt 3990 lt  td gt  x000D                   lt td gt c stevens datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Hermione lt  td gt  x000D                   lt td gt Butler lt  td gt  x000D                   lt td gt Regional Director lt  td gt  x000D                   lt td gt London lt  td gt  x000D                   lt td gt 47 lt  td gt  x000D                   lt td gt 2011 03 21 lt  td gt  x000D                   lt td gt  356 250 lt  td gt  x000D                   lt td gt 1016 lt  td gt  x000D                   lt td gt h butler datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Lael lt  td gt  x000D                   lt td gt Greer lt  td gt  x000D                   lt td gt Systems Administrator lt  td gt  x000D                   lt td gt London lt  td gt  x000D                   lt td gt 21 lt  td gt  x000D                   lt td gt 2009 02 27 lt  td gt  x000D                   lt td gt  103 500 lt  td gt  x000D                   lt td gt 6733 lt  td gt  x000D                   lt td gt l greer datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Jonas lt  td gt  x000D                   lt td gt Alexander lt  td gt  x000D                   lt td gt Developer lt  td gt  x000D                   lt td gt San Francisco lt  td gt  x000D                   lt td gt 30 lt  td gt  x000D                   lt td gt 2010 07 14 lt  td gt  x000D                   lt td gt  86 500 lt  td gt  x000D                   lt td gt 8196 lt  td gt  x000D                   lt td gt j alexander datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Shad lt  td gt  x000D                   lt td gt Decker lt  td gt  x000D                   lt td gt Regional Director lt  td gt  x000D                   lt td gt Edinburgh lt  td gt  x000D                   lt td gt 51 lt  td gt  x000D                   lt td gt 2008 11 13 lt  td gt  x000D                   lt td gt  183 000 lt  td gt  x000D                   lt td gt 6373 lt  td gt  x000D                   lt td gt s decker datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Michael lt  td gt  x000D                   lt td gt Bruce lt  td gt  x000D                   lt td gt Javascript Developer lt  td gt  x000D                   lt td gt Singapore lt  td gt  x000D                   lt td gt 29 lt  td gt  x000D                   lt td gt 2011 06 27 lt  td gt  x000D                   lt td gt  183 000 lt  td gt  x000D                   lt td gt 5384 lt  td gt  x000D                   lt td gt m bruce datatables net lt  td gt  x000D               lt  tr gt  x000D               lt tr gt  x000D                   lt td gt Donna lt  td gt  x000D                   lt td gt Snider lt  td gt  x000D                   lt td gt Customer Support lt  td gt  x000D                   lt td gt New York lt  td gt  x000D                   lt td gt 27 lt  td gt  x000D                   lt td gt 2011 01 25 lt  td gt  x000D                   lt td gt  112 000 lt  td gt  x000D                   lt td gt 4226 lt  td gt  x000D                   lt td gt d snider datatables net lt  td gt  x000D               lt  tr gt  x000D           lt  tbody gt  x000D       lt  table gt  x000D   x000D   x000D    This can be easily done with the help of datatables  People who are new to data tables  please refer to https   datatables net   Its a plugin and offers a lot of features In the the code given  header is fixed first 3 columns are fixed and several other features are also there

User · Answer

If you want a table where only the columns scroll horizontally  you can position  absolute the first column  and specify its width explicitly   and then wrap the entire table in an overflow-x  scroll  block   Don t bother trying this in IE7  however     Relevant HTML  amp  CSS    x000D   x000D  table   x000D    border-collapse  separate  x000D    border-spacing  0  x000D    border-top  1px solid grey  x000D    x000D   x000D  td  th   x000D    margin  0  x000D    border  1px solid grey  x000D    white-space  nowrap  x000D    border-top-width  0px  x000D    x000D   x000D  div   x000D    width  500px  x000D    overflow-x  scroll  x000D    margin-left  5em  x000D    overflow-y  visible  x000D    padding  0  x000D    x000D   x000D   headcol   x000D    position  absolute  x000D    width  5em  x000D    left  0  x000D    top  auto  x000D    border-top-width  1px  x000D      only relevant for first row   x000D    margin-top  -1px  x000D      compensate for top border   x000D    x000D   x000D   headcol before   x000D    content   Row    x000D    x000D   x000D   long   x000D    background  yellow  x000D    letter-spacing  1em  x000D    x000D   lt div gt  x000D   lt table gt  x000D           lt tr gt  lt th class  headcol  gt 1 lt  th gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt  tr gt  x000D           lt tr gt  lt th class  headcol  gt 2 lt  th gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt  tr gt  x000D           lt tr gt  lt th class  headcol  gt 3 lt  th gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt  tr gt  x000D           lt tr gt  lt th class  headcol  gt 4 lt  th gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt  tr gt  x000D           lt tr gt  lt th class  headcol  gt 5 lt  th gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt  tr gt  x000D           lt tr gt  lt th class  headcol  gt 6 lt  th gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt td class  long  gt QWERTYUIOPASDFGHJKLZXCVBNM lt  td gt  lt  tr gt  x000D   lt  table gt  x000D   lt  div gt  x000D   x000D   x000D    Fiddle

User · Answer

In HTML5  you can use CSS style transform  However  i reccomend you  swipe between pages  turn off If you implement on Mac   look at sample codePen   x000D   x000D  let l    0  x000D  let t    0  x000D   x000D  const MouseWheelHandler    e    gt    x000D       vertical scroll x000D    if  e deltaX    -0    x000D         t   t - e deltaY x000D   x000D       horizonal scroll x000D      else if  e deltaY    -0    x000D      l   l - e deltaX x000D      if  l  gt   0    x000D        l   0  x000D        document getElementById  gantt task   style transform    translateX 1px   x000D        document getElementById  gantt task header   style transform    translateX 1px   x000D        return false x000D         x000D      document getElementById  gantt task   style transform    translateX     l toString      px   x000D      document getElementById  gantt task header   style transform    translateX     l toString      px   x000D      x000D    return false  x000D    x000D   x000D  window addEventListener  wheel   MouseWheelHandler  false   x000D   row   x000D    border-bottom  1px solid  979A9A x000D    x000D   gantt grid header   x000D    height    30px  x000D    width     100px  x000D    position  fixed  x000D    z-index   3  x000D    top       0px  x000D    left      0px  x000D    border    1px solid  cecece  x000D    background-color   F08080  x000D         x000D   x000D   gantt task header   x000D    height    30px  x000D    width     400px  x000D    position  fixed  x000D    z-index   2  x000D    top       0px  x000D    left      100px  x000D    border    1px solid  cecece  x000D    background-color   FFC300  x000D    x000D   x000D   gantt grid   x000D    width     100px   x000D    height    400px  x000D    position  absolute  x000D    left      0px  x000D    top       0px  x000D    z-index   1  x000D    border    1px solid  cecece  x000D    background-color   DAF7A6  x000D    x000D   x000D   gantt task   x000D    width     400px   x000D    height    400px  x000D    position  absolute  x000D    left      100px  x000D    top       0px  x000D    border    1px solid  cecece  x000D    background-color   FF5733  x000D    x000D   lt html gt  x000D       lt div id  gantt grid header  gt  x000D        HEADER x000D       lt  div gt  x000D       lt div id  gantt grid  gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D         lt div class  row  gt V Scroll OK lt  div gt  x000D       lt  div gt  x000D       lt div id  gantt task header  gt  x000D        DATA HEADER x000D       lt  div gt  x000D       lt div id  gantt task  gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D         lt div class  row  gt Vertical Horizenal Scroll OK lt  div gt  x000D       lt  div gt  x000D   lt  html gt  x000D   x000D   x000D

User · Answer

Style the left column with position  fixed    You ll presumably want to use top and left styles to control where exactly it occurs

User · Answer

I didn t check each and every answer for this question  but after analyzing most of them I found that design fails in case of multiline data in cells or head  I used Javascript to solve this  I hope someone finds this helpful   https   codepen io kushagrarora pen zeYaoY   x000D   x000D  var freezeTables   document getElementsByClassName  freeze-pane    x000D   x000D     forEach call freezeTables  ftable   gt    x000D    var wrapper   document createElement  div    x000D    wrapper className    freeze-pane-wrapper   x000D    var scroll   document createElement  div    x000D    scroll className    freeze-pane-scroll   x000D   x000D    wrapper appendChild scroll   x000D   x000D    ftable parentNode replaceChild wrapper  ftable   x000D   x000D    scroll appendChild ftable   x000D   x000D    var heads   ftable querySelectorAll  th first-child    x000D   x000D    let maxWidth   0  x000D   x000D       forEach call heads  head   gt    x000D      var w   window x000D         getComputedStyle head  x000D         getPropertyValue  width   x000D         split  px   0   x000D      if  Number w   gt  Number maxWidth   maxWidth   w  x000D        x000D   x000D    ftable parentElement style marginLeft   maxWidth    px   x000D    ftable parentElement style width    calc 100  -     maxWidth    px    x000D       forEach call heads  head   gt    x000D      head style width   maxWidth    px   x000D      var restRowHeight   window x000D         getComputedStyle head nextElementSibling  x000D         getPropertyValue  height    x000D      var headHeight   window getComputedStyle head  getPropertyValue  height    x000D      if  headHeight  gt  restRowHeight  x000D        head nextElementSibling style height   headHeight  x000D      else head style height   restRowHeight  x000D        x000D      x000D   import url  https   fonts googleapis com css family Open Sans    x000D      x000D    font-family   Open Sans   sans-serif  x000D    x000D   x000D   container   x000D    width  400px  x000D    height  90vh  x000D    border  1px solid black  x000D    overflow  hidden  x000D    x000D   x000D  table  x000D  th  x000D  td   x000D    border  1px solid  eee  x000D    x000D   x000D   table   x000D    width  100   x000D    margin-bottom  1rem  x000D    table-layout  fixed  x000D    border-collapse  collapse  x000D    x000D   x000D   freeze-pane-wrapper   x000D    position  relative  x000D    x000D   x000D   freeze-pane-scroll   x000D    overflow-x  scroll  x000D    overflow-y  visible  x000D    x000D   x000D   freeze-pane th first-child   x000D    position  absolute  x000D    background-color  pink  x000D    left  0  x000D    top  auto  x000D    max-width  40   x000D    x000D   lt div class  container  gt  x000D     lt table class  freeze-pane  gt  x000D       lt tbody gt  x000D         lt tr gt  x000D           lt th gt  x000D             lt p gt Model lt  p gt  x000D           lt  th gt  x000D           lt th gt  x000D             lt p gt Mercedes Benz AMG C43 4dr lt  p gt  x000D           lt  th gt  x000D           lt th gt  x000D             lt p gt Audi S4 Premium 4dr lt  p gt  x000D           lt  th gt  x000D           lt th gt  x000D             lt p gt BMW 440i 4dr sedan lt  p gt  x000D           lt  th gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt th gt  x000D             lt p gt Passenger capacity lt  p gt  x000D           lt  th gt  x000D           lt td gt  x000D             lt p gt 5 lt  p gt  x000D           lt  td gt  x000D           lt td gt  x000D             lt p gt 5 lt  p gt  x000D           lt  td gt  x000D           lt td gt  x000D             lt p gt 5 lt  p gt  x000D           lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt th gt  x000D             lt p gt Front  Head Shoulder Leg   In   lt  p gt  x000D           lt  th gt  x000D           lt td gt  x000D             lt p gt 37 1 55 3 41 7 lt  p gt  x000D           lt  td gt  x000D           lt td gt  x000D             lt p gt 38 9 55 9 41 3 lt  p gt  x000D           lt  td gt  x000D           lt td gt  x000D             lt p gt 39 9 54 8 42 2 lt  p gt  x000D           lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt th gt  x000D             lt p gt Second  Head Shoulder Leg   In   lt  p gt  x000D           lt  th gt  x000D           lt td gt  x000D             lt p gt 37 1 55 5 35 2 lt  p gt  x000D           lt  td gt  x000D           lt td gt  x000D             lt p gt 37 4 54 5 35 7 lt  p gt  x000D           lt  td gt  x000D           lt td gt  x000D             lt p gt 36 9 54 3 33 7 lt  p gt  x000D           lt  td gt  x000D         lt  tr gt  x000D       lt  tbody gt  x000D     lt  table gt  x000D   lt  div gt  x000D   x000D   x000D    Note  the  container  div is just to demonstrate that code is compatible with mobile-view

User · Answer

For me this was the only one that worked perfectly  thanks to Paul O Brien        https   codepen io paulobrien pen gWoVzN  Here s the snippet    x000D   x000D     requires jquery library x000D  jQuery document  ready function     x000D    jQuery   main-table   clone true  appendTo   table-scroll   addClass  clone       x000D       x000D     table-scroll   x000D      position relative  x000D      max-width 600px  x000D      margin auto  x000D      overflow hidden  x000D      border 1px solid  000  x000D      x000D   table-wrap   x000D   width 100   x000D   overflow auto  x000D    x000D   table-scroll table   x000D   width 100   x000D   margin auto  x000D   border-collapse separate  x000D   border-spacing 0  x000D    x000D   table-scroll th   table-scroll td   x000D   padding 5px 10px  x000D   border 1px solid  000  x000D   background  fff  x000D   white-space nowrap  x000D   vertical-align top  x000D    x000D   table-scroll thead   table-scroll tfoot   x000D   background  f9f9f9  x000D    x000D   clone   x000D   position absolute  x000D   top 0  x000D   left 0  x000D   pointer-events none  x000D    x000D   clone th   clone td   x000D   visibility hidden x000D    x000D   clone td   clone th   x000D   border-color transparent x000D    x000D   clone tbody th   x000D   visibility visible  x000D   color red  x000D    x000D   clone  fixed-side   x000D   border 1px solid  000  x000D   background  eee  x000D   visibility visible  x000D    x000D   clone thead   clone tfoot background transparent   x000D   lt div id  table-scroll  class  table-scroll  gt  x000D     lt div class  table-wrap  gt  x000D       lt table class  main-table  gt  x000D         lt thead gt  x000D           lt tr gt  x000D             lt th class  fixed-side  scope  col  gt  amp nbsp  lt  th gt  x000D             lt th scope  col  gt Header 2 lt  th gt  x000D             lt th scope  col  gt Header 3 lt  th gt  x000D             lt th scope  col  gt Header 4 lt  th gt  x000D             lt th scope  col  gt Header 5 lt  th gt  x000D             lt th scope  col  gt Header 6 lt  th gt  x000D             lt th scope  col  gt Header 7 lt  th gt  x000D             lt th scope  col  gt Header 8 lt  th gt  x000D           lt  tr gt  x000D         lt  thead gt  x000D         lt tbody gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt Left Column lt  th gt  x000D             lt td gt Cell content lt br gt  x000D              test lt  td gt  x000D             lt td gt  lt a href     gt Cell content longer lt  a gt  lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D           lt  tr gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt Left Column lt  th gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content longer lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D           lt  tr gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt Left Column lt  th gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content longer lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D           lt  tr gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt Left Column lt  th gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content longer lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D           lt  tr gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt Left Column lt  th gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content longer lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D           lt  tr gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt Left Column lt  th gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content longer lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D             lt td gt Cell content lt  td gt  x000D           lt  tr gt  x000D         lt  tbody gt  x000D         lt tfoot gt  x000D           lt tr gt  x000D             lt th class  fixed-side  gt  amp nbsp  lt  th gt  x000D             lt td gt Footer 2 lt  td gt  x000D             lt td gt Footer 3 lt  td gt  x000D             lt td gt Footer 4 lt  td gt  x000D             lt td gt Footer 5 lt  td gt  x000D             lt td gt Footer 6 lt  td gt  x000D             lt td gt Footer 7 lt  td gt  x000D             lt td gt Footer 8 lt  td gt  x000D           lt  tr gt  x000D         lt  tfoot gt  x000D       lt  table gt  x000D     lt  div gt  x000D   lt  div gt  x000D   x000D   lt p gt See  lt a href  https   codepen io paulobrien pen LBrMxa  target  blank  gt position Sticky version  lt  a gt with no JS lt  p gt  x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 3 jquery min js  type  text javascript  gt  lt  script gt  x000D   x000D   x000D

User · Answer

If you don t want to touch your current table too much you can make a fake pinned column in front of the table    The example shows one way of doing it without JS   x000D   x000D  table   x000D    border-collapse  collapse  x000D    border-spacing  0  x000D    border  1px solid  ddd  x000D    min-width  600px  x000D    x000D   x000D   labels   x000D    display flex  x000D    flex-direction  column x000D    x000D   x000D   overflow   x000D    overflow-x  scroll  x000D    min width  400px  x000D    flex  1  x000D    x000D   x000D   label   x000D    display  flex  x000D    align-items  center  x000D    white-space nowrap  x000D    padding  10px  x000D    flex  1  x000D    border-bottom  1px solid  ddd  x000D    border-right  2px solid  ddd  x000D    x000D   x000D   label last-of-type   x000D    overflow-x  scroll  x000D    border-bottom  0  x000D    x000D   x000D  td   x000D    border  1px solid  ddd  x000D    padding  10px  x000D    x000D   x000D   flex   x000D    display flex  x000D    max-width  600px  x000D    padding  0  x000D    border  5px solid  ddd  x000D    x000D   lt div class  flex  gt  x000D     lt div class  labels  gt  x000D       lt span class  label  gt Label 1 lt  span gt  x000D       lt span class  label  gt Lorem ipsum dolor sit amet  lt  span gt  x000D       lt span class  label  gt Lorem ipsum dolor  lt  span gt  x000D     lt  div gt  x000D     lt div class  overflow  gt  x000D       lt table gt  x000D         lt tr gt  x000D           lt td class  long  gt Lorem ipsum dolor sit amet consectetur adipisicing lt  td gt  x000D           lt td class  long  gt Lorem ipsum dolor sit amet consectetur adipisicing lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td class  long  gt Lorem ipsum dolor sit amet consectetur adipisicing lt  td gt  x000D           lt td class  long  gt Lorem ipsum dolor sit amet consectetur adipisicing lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td class  long  gt Lorem ipsum dolor sit amet consectetur adipisicing lt  td gt  x000D           lt td class  long  gt Lorem ipsum dolor sit amet consectetur adipisicing lt  td gt  x000D         lt  tr gt  x000D     lt  table gt  x000D     lt  div gt  x000D   lt  div gt  x000D   x000D   x000D

User · Answer

If you re in Webdevelopper hell and need to make this work for IE6  here s a sample code I used    lt html gt   lt head gt   lt style type  text css  gt   fixme       position  relative      left  expression    20     ignoreMe2   document documentElement scrollLeft   document documentElement scrollLeft   document body scrollLeft        px         background-color   FFFFFF     lt  style gt   lt  head gt   lt body gt   lt table width  1500px  border  2  gt       lt tr gt           lt td class  fixme  style  width  200px   gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt       lt  tr gt       lt tr gt           lt td class  fixme  style  width  200px   gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt       lt  tr gt       lt tr gt           lt td class  fixme  style  width  200px   gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt       lt  tr gt       lt tr gt           lt td class  fixme  style  width  200px   gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt           lt td gt loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet loremp ispum dolor sit amet  lt  td gt       lt  tr gt   lt  table gt   lt  body gt   lt  html gt    This will work probably ONLY for IE6  so use conditional comments for the CSS

User · Answer

I just made the right-most sticky column of a table sticky   th last-of-type    position  sticky   right  0   width  120px   background   f7f7f7      td last-of-type    position  sticky   right  0   background   f7f7f7   width  120px      I believe if you ll do  position  sticky  left  0    you ll get the desired result

User · Answer

I took Earmon Nerbonne s answer and edited it to work with tables that fill the whole width   http   jsfiddle net DYgD6 6    lt  DOCTYPE html gt   lt html gt  lt head gt  lt title gt testdoc lt  title gt   lt style type  text css  gt              body           font 16px Calibri            table           border-collapse separate          border-top  3px solid grey            td           margin 0          border 3px solid grey          border-top-width 0px          white-space nowrap             outerdiv           position  absolute          top  0          left  0          right  5em             innerdiv           width  100           overflow-x scroll          margin-left  5em          overflow-y visible          padding-bottom 1px             headcol           position absolute          width 5em          left 0          top auto          border-right  0px none black          border-top-width 3px            only relevant for first row           margin-top -3px            compensate for top border              headcol before           content  Row               long           background yellow          letter-spacing 1em         lt  style gt  lt  head gt  lt body gt     lt div id  outerdiv  gt      lt div id  innerdiv  gt       lt table gt           lt tr gt               lt td class  headcol  gt 1 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 tr gt               lt td class  headcol  gt 2 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 tr gt               lt td class  headcol  gt 3 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 tr gt               lt td class  headcol  gt 4 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 tr gt               lt td class  headcol  gt 5 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 tr gt               lt td class  headcol  gt 6 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 tr gt               lt td class  headcol  gt 7 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 tr gt               lt td class  headcol  gt 8 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 tr gt               lt td class  headcol  gt 9 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   lt  div gt  lt  div gt   lt  body gt  lt  html gt    The width of the fixed column still needs to be a set value though

User · Answer

If the table has tbody and thead  make them the relative container in which we can fix td and th as absolute  table tbody       position  relative     table thead       position  relative       Make both the first header and first data cells  First column  absolute so that it sticks to the left  table td first-of-type       position  absolute     table th first-of-type       position  absolute       Move Second column according to the width of column 1   table td nth-of-type 2        padding-left   lt Width of column 1 gt      table th nth-of-type 2        padding-left   lt Width of column 1 gt

User · Answer

No need to add any plugin  CSS can do this job      The idea is to make the position of all the first cells in each column absolute  and make width fixed   Ex   max-width  125px  min-width  125px  position  absolute    This hides some parts of some columns under the first column  so add an empty second column  add second empty td  with width same as the first column   I tested and this works in Chrome and Firefox

User · Answer

For most browsers released after 2017   You can use the position  sticky  See https   caniuse com  feat css-sticky   There is no need for a fixed width column   Run the code snippet below to see how it works    x000D   x000D   tscroll   x000D    width  400px  x000D    overflow-x  scroll  x000D    margin-bottom  10px  x000D    border  solid black 1px  x000D    x000D   x000D   tscroll table td first-child   x000D    position  sticky  x000D    left  0  x000D    background-color   ddd  x000D    x000D   x000D   tscroll td   tscroll th   x000D    border-bottom  dashed  888 1px  x000D    x000D   lt html gt  x000D   lt div class  tscroll  gt  x000D     lt table gt  x000D       lt thead gt  x000D         lt tr gt  x000D           lt th gt  lt  th gt  x000D           lt th colspan  5  gt Heading 1 lt  th gt  x000D           lt th colspan  8  gt Heading 2 lt  th gt  x000D           lt th colspan  4  gt Heading 3 lt  th gt  x000D         lt  tr gt  x000D       lt  thead gt  x000D       lt tbody gt  x000D         lt tr gt  x000D           lt td gt 9 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 10 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 11 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 12 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 13 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 14 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 15 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 16 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt 17 00 lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt BBB lt  td gt  x000D           lt td gt CCC lt  td gt  x000D           lt td gt DDD lt  td gt  x000D           lt td gt EEE lt  td gt  x000D           lt td gt FFF lt  td gt  x000D           lt td gt GGG lt  td gt  x000D           lt td gt HHH lt  td gt  x000D           lt td gt III lt  td gt  x000D           lt td gt JJJ lt  td gt  x000D           lt td gt KKK lt  td gt  x000D           lt td gt LLL lt  td gt  x000D           lt td gt MMM lt  td gt  x000D           lt td gt NNN lt  td gt  x000D           lt td gt OOO lt  td gt  x000D           lt td gt PPP lt  td gt  x000D           lt td gt QQQ lt  td gt  x000D         lt  tr gt  x000D       lt  tbody gt  x000D       lt  table gt  x000D   lt  div gt  x000D   x000D   x000D

User · Answer

Here is another modification of the most popular answer  but with handling of variable length of text in the first column labels  http   jsfiddle net ozx56n41   Basically  I m using the second column for creating row height  like was mentioned  But my fiddle actually works unlike most mentioned above   HTML    lt div id  outerdiv  gt       lt div id  innerdiv  gt           lt table gt               lt tr gt                   lt td class  headcol  gt  lt div gt This is a long label lt  div gt  lt  td gt                   lt td class  hiddenheadcol  gt  lt div gt This is a long label lt  div gt  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 tr gt                   lt td class  headcol  gt  lt div gt Short label lt  div gt  lt  td gt                   lt td class  hiddenheadcol  gt  lt div gt Short label lt  div gt  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       lt  div gt   lt  div gt    CSS   body       font  16px Calibri     outerdiv       position  absolute      top  0      left  0      right  0      width  100       border-top  1px solid grey     innerdiv       overflow-x  scroll      margin-left  100px      overflow-y  visible      padding-bottom  1px    table       border-collapse separate    td       margin  0      border  1px solid grey      border-top-width  0      border-left-width  0px      padding  10px    td headcol          Frozen 1st column        position  absolute      left  0      top  auto      border-bottom-width  1px      padding  0      border-left-width  1px    td hiddenheadcol          Hidden 2nd column to create height        max-width  0      visibility  hidden      padding  0    td headcol div          Text container in the 1st column        width  100px      max-width  100px      background  lightblue      padding  10px      box-sizing  border-box    td hiddenheadcol div          Text container in the 2nd column        width  100px      max-width  100px      background  red      padding  10px    td long       background yellow      letter-spacing 1em

User · Answer

In case of fixed width left column the best solution is provided by Eamon Nerbonne   In case of variable width left column the best solution I found is to make two identical tables and push one above another  Demo  http   jsfiddle net xG5QH 6     lt  DOCTYPE html gt   lt html gt   lt head gt   lt style type  text css  gt     important styles      container         Attach fixed-th-table to this container        in order to layout fixed-th-table       in the same way as scolled-td-table        position  relative         Truncate fixed-th-table       overflow  hidden      fixed-th-table-wrapper td   fixed-th-table-wrapper th   scrolled-td-table-wrapper td   scrolled-td-table-wrapper th         Set background to non-transparent color       because two tables are one above another            background  white     fixed-th-table-wrapper         Make table out of flow       position  absolute     fixed-th-table-wrapper th          Place fixed-th-table th-cells above         scrolled-td-table td-cells              position  relative      z-index  1     scrolled-td-table-wrapper td          Place scrolled-td-table td-cells        above fixed-th-table              position  relative     scrolled-td-table-wrapper         Make horizonal scrollbar if needed       overflow-x  auto         Simulating border-collapse  collapse     because fixed-th-table borders    are below   scrolling-td-wrapper table  borders     table       border-spacing  0    td  th      border-style  solid     border-color  black     border-width  1px 1px 0 0    th first-child      border-left-width  1px    tr last-child td  tr last-child th      border-bottom-width  1px        Unimportant styles      container       width  250px    td  th      padding  5px     lt  style gt   lt  head gt    lt body gt   lt div class  container  gt    lt div class  fixed-th-table-wrapper  gt   lt  -- fixed-th-table -- gt   lt table gt       lt tr gt            lt th gt aaaaaaa lt  th gt            lt td gt ccccccccccc asdsad asd as lt  td gt            lt td gt ccccccccccc asdsad asd as lt  td gt       lt  tr gt       lt tr gt            lt th gt cccccccc lt  th gt            lt td gt xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz lt  td gt            lt td gt xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz lt  td gt       lt  tr gt   lt  table gt   lt  div gt    lt div class  scrolled-td-table-wrapper  gt   lt  -- scrolled-td-table      - same as fixed-th-table -- gt   lt table gt       lt tr gt            lt th gt aaaaaaa lt  th gt            lt td gt ccccccccccc asdsad asd as lt  td gt            lt td gt ccccccccccc asdsad asd as lt  td gt       lt  tr gt       lt tr gt            lt th gt cccccccc lt  th gt            lt td gt xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz lt  td gt            lt td gt xxxxxxxxxxxxxxxxxxxx yyyyyyyyyyyyyy zzzzzzzzzzzzz lt  td gt       lt  tr gt   lt  table gt   lt  div gt    lt  div gt   lt  body gt   lt  html gt

[html] How do I create an HTML table with a fixed/frozen left column and a scrollable body?

Examples related to html

Examples related to css

Examples related to html-table