How to set tbody height with overflow scroll

Question

I am facing problem while setting tbody height width overflow scroll     lt style gt        tbody         height 50px display block overflow scroll            lt  style gt           lt h3 gt Table B lt  h3 gt       lt table style  border  1px solid red width 300px display block  gt           lt thead gt               lt tr gt                   lt td gt Name lt  td gt                   lt td gt phone lt  td gt               lt  tr gt           lt  thead gt           lt tbody style  height 50px display block overflow scroll  gt               lt tr gt                   lt td gt AAAA lt  td gt                   lt td gt 323232 lt  td gt               lt  tr gt               lt tr gt                   lt td gt BBBBB lt  td gt                   lt td gt 323232 lt  td gt               lt  tr gt               lt tr gt                   lt td gt CCCCC lt  td gt                   lt td gt 3435656 lt  td gt               lt  tr gt           lt  tbody gt       lt  table gt    Visit my fiddle here  I want table B like Table A with overflow scroll   Any help will be appreciated   Many Thanks  M

User · Answer

Here is a good example for table scrolling across x and y way  Horizontal and vertical scrolling is the best thing for responsive table   x000D   x000D  table  th  tr  td     border  1px solid lightgrey    border-collapse  collapse       tbody     max-height  200px  max-width  200px    overflow  auto    display  block    table-layout  fixed     tr     display  table    x000D   lt table gt     lt thead gt         lt tr gt       lt th gt 1 lt  th gt       lt th gt 2 lt  th gt       lt th gt 3 lt  th gt     lt  tr gt     lt  thead gt     lt tbody gt         lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt     lt  tr gt       lt tr gt       lt th gt        lt input type  checkbox  gt      lt  th gt       lt td gt 2 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt        lt td gt 3 lt  td gt       lt td

User · Answer

In my case I wanted to have responsive table height instead of fixed height in pixels as the other answers are showing  To do that I used percentage of visible height property and overflow on div containing the table     amp   table-container     height  70vh    overflow  scroll      This way the table will expand along with the window being resized

User · Answer

I guess what you re trying to do  is to keep the header fixed and to scroll the body content  You can scroll the content into 2 directions    horizontally  you won t be able to scroll the content horizontally unless you use a slider  a jQuery slider for example   I would recommend to avoid using a table in this case  vertically  you won t be able to achieve that with a tbody tag  because assigning display block or display inline-block will break the layout of the table    Here s a solution using divs  JSFiddle  HTML    lt div class  wrap header  gt       lt div class  column  gt          Name      lt  div gt       lt div class  column  gt          Phone      lt  div gt       lt div class  clearfix  gt  lt  div gt   lt  div gt   lt div class  wrap body  gt       lt div class  sliding wrapper  gt           lt div class  serie  gt               lt div class  cell  gt                  AAAAAA              lt  div gt               lt div class  cell  gt                  323232              lt  div gt               lt div class  clearfix  gt  lt  div gt           lt  div gt           lt div class  serie  gt               lt div class  cell  gt                  BBBBBB              lt  div gt               lt div class  cell  gt                  323232              lt  div gt               lt div class  clearfix  gt  lt  div gt           lt  div gt           lt div class  serie  gt               lt div class  cell  gt                  CCCCCC              lt  div gt               lt div class  cell  gt                  3435656              lt  div gt               lt div class  clearfix  gt  lt  div gt           lt  div gt       lt  div gt   lt  div gt    CSS    wrap header width 204px    sliding wrapper   wrap body  width 221px    sliding wrapper  overflow-y scroll  overflow-x none    sliding wrapper   wrap body  height 45px    wrap header   wrap body  overflow hidden    column  width 100px  float left  border 1px solid red    cell  width 100px  float left  border 1px solid red            info Clearfix  clear all the floated elements      clearfix after       visibility hidden      display block      font-size 0      content          clear both      height 0     clearfix  display inline-table            hack Display the Clearfix as a block element     hackfor Every browser except IE for Macintosh            Hides from IE-mac           html  clearfix  height 1         clearfix  display block          End hide from IE-mac      Explanation   You have a sliding wrapper which will contain all the data   Note the following    wrap header width 204px    sliding wrapper   wrap body  width 221px     There s a difference of 17px because we need to take into consideration the width of the scrollbar

User · Answer

It is simple way to use scroll bar to table body  x000D   x000D     It is simple way to use scroll bar to table body    table tbody     display  block    max-height  300px    overflow-y  scroll     table thead  table tbody tr     display  table    width  100     table-layout  fixed    x000D   lt table gt     lt thead gt       lt th gt Invoice Number lt  th gt       lt th gt Purchaser lt  th gt       lt th gt Invoice Amount lt  th gt       lt th gt Invoice Date lt  th gt     lt  thead gt     lt tbody gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt       lt tr gt         lt td gt INV-1233 lt  td gt         lt td gt Dinesh Vaitage lt  td gt         lt td gt  300 lt  td gt         lt td gt 01 12 2017 lt  td gt       lt  tr gt     lt  tbody gt   lt  table gt  x000D   x000D   x000D

User · Answer

Simplest of all solutions   Add the below code in CSS    tableClassName tbody     display  block    max-height  200px    overflow-y  scroll      tableClassName thead   tableClassName tbody tr     display  table    width  100     table-layout  fixed     tableClassName thead     width  calc  100  - 1 1em           1 1 em is the average width of the scroll bar  please modify this if needed

User · Answer

Webkit seems to use internally display  table-row-group for the tbody tag  There is currently a bug with setting height to it  https   github com w3c csswg-drafts issues 476  Let s hope it will be solved soon

User · Answer

By default overflow does not apply to table group elements unless you give a display block to  lt tbody gt   also you have to give a position relative and display  block to  lt thead gt    Check the DEMO    fixed     width 350px    table-layout  fixed    border-collapse  collapse     fixed th     text-decoration  underline     fixed th   fixed td     padding  5px    text-align  left    min-width  200px       fixed thead     background-color  red    color   fdfdfd     fixed thead tr     display  block    position  relative     fixed tbody     display  block    overflow  auto    width  100     height  100px    overflow-y  scroll      overflow-x  hidden

User · Answer

If you want tbody to show a scrollbar  set its display  block   Set display  table  for the tr so that it keeps the behavior of a table  To evenly spread the cells  use table-layout  fixed   DEMO    CSS  table  tr td       border  1px solid red   tbody       display  block      height  50px      overflow  auto    thead  tbody tr       display  table      width  100       table-layout  fixed    even columns width   fix width of table too     thead       width  calc  100  - 1em     scrollbar is average 1em 16px width  remove it from thead width      table       width  400px      If tbody doesn t show a scroll  because content is less than height or max-height  set the scroll any time with  overflow-y  scroll   DEMO 2 Important note  this approach to making a table scrollable has drawbacks in some cases   See comments below

User · Answer

Based on this answer  here s a minimal solution if you re already using Bootstrap   div scrollable-table-wrapper     height  500px    overflow  auto     thead tr th       position  sticky      top  0           lt div class  scrollable-table-wrapper  gt     lt table class  table  gt       lt thead gt     lt  thead gt       lt tbody gt     lt  tbody gt     lt  table gt   lt  div gt    Tested on Bootstrap v3

User · Answer

Making scrolling tables is always a challenge  This is a solution where the table is scrolled both horizontally and vertically with fixed height on tbody making theader and tbody  stick   without display  sticky   I ve added a  big  table just to show  I got inspiration from G-Cyrillus to make the tbody display block  But when it comes to width of a cell  both in header and body   it s depending on the inside content  Therefore I added content with specific width inside each cell  both in thead and minimum first row in tbody  the other rows adapt accordingly    x000D   x000D   go-wrapper   x000D      overflow-x  auto  x000D      width  100   x000D    x000D   go-wrapper table   x000D      width  auto  x000D    x000D   go-wrapper table tbody   x000D      display  block  x000D      height  220px  x000D      overflow  auto  x000D    x000D   go-wrapper table thead   x000D      display  table  x000D    x000D   go-wrapper table tfoot   x000D      display  table  x000D    x000D   go-wrapper table thead tr   x000D   go-wrapper table tbody tr  x000D   go-wrapper table tfoot tr   x000D      display  table-row  x000D    x000D   x000D   go-wrapper table th  x000D   go-wrapper table td    x000D      white-space  nowrap   x000D    x000D   x000D   go-wrapper  aw-50    min-height  1px  width  50px    x000D   go-wrapper  aw-100   min-height  1px  width  100px    x000D   go-wrapper  aw-200   min-height  1px  width  200px    x000D   go-wrapper  aw-400   min-height  1px  width  400px    x000D   x000D         Colors        x000D   go-wrapper table   x000D      border  2px solid red x000D    x000D   go-wrapper table thead   x000D   go-wrapper table tbody   x000D   go-wrapper table tfoot   x000D      outline  1px solid green x000D    x000D   go-wrapper td   x000D      outline  1px solid blue x000D    x000D   lt  DOCTYPE html gt  x000D   lt html lang  en  gt  x000D   x000D   lt head gt  x000D       lt meta charset  UTF-8  gt  x000D       lt meta name  viewport  content  width device-width  initial-scale 1  shrink-to-fit no  gt  x000D       lt title gt Template lt  title gt  x000D       lt link rel  stylesheet  href  https   stackpath bootstrapcdn com bootstrap 4 4 1 css bootstrap min css  integrity  sha384-Vkoo8x4CGsO3 Hhxv8T Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh  crossorigin  anonymous  gt  x000D       lt link rel  stylesheet  href  css main css  gt  x000D   lt  head gt  x000D   x000D   lt body gt  x000D       lt div class  container  gt  x000D           lt div class  row mt-5 justify-content-md-center  gt  x000D               lt div class  col-8  gt  x000D                   lt div class  go-wrapper  gt  x000D                       lt table class  table  gt  x000D                           lt thead gt  x000D                               lt tr gt  x000D                                   lt th gt  lt div class  aw-50   gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-200  gt Name lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-50   gt Week lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-100  gt Date lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-100  gt Time lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-200  gt Project lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-400  gt Text lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-200  gt Activity lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-50   gt Hours lt  th gt  x000D                                   lt th gt  lt div class  aw-50   gt Pause lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-100  gt Status lt  div gt  lt  th gt  x000D                               lt  tr gt  x000D                           lt  thead gt  x000D                           lt tbody gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  aw-50  gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-200  gt AAAAA lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-50   gt 15 lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-100  gt 07 04 2020 lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-100  gt 10 00 lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-200  gt Project 1 lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-400  gt Blah blah blah lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-200  gt Activity lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-50   gt 2t lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-50   gt 30min lt  div gt  lt  td gt  x000D                                   lt td gt  lt div class  aw-100  gt Waiting lt  div gt  lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt BBBBB lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt CCCCC lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah Blah blah blah lt  td gt  x000D                                   lt td gt Activity Activity Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt DDDDD lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt EEEEE lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt FFFFF lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity Activity Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt GGGGG lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt HHHHH lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt IIIII lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt JJJJJ lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt KKKKK lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt LLLLL lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt MMMMM lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt NNNNN lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt OOOOO lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt PPPPP lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt QQQQQ lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt RRRRR lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt SSSSS lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt TTTTT lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt UUUUU lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt VVVVV lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt XXXXX lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt YYYYY lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt ZZZZZ lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt            lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt            lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                               lt tr gt  x000D                                   lt td gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  td gt  x000D                                   lt td gt            lt  td gt  x000D                                   lt td gt 15 lt  td gt  x000D                                   lt td gt 07 04 2020 lt  td gt  x000D                                   lt td gt 10 00 lt  td gt  x000D                                   lt td gt Project 1 lt  td gt  x000D                                   lt td gt Blah blah blah lt  td gt  x000D                                   lt td gt Activity lt  td gt  x000D                                   lt td gt 2t lt  td gt  x000D                                   lt td gt 30min lt  td gt  x000D                                   lt td gt Waiting lt  td gt  x000D                               lt  tr gt  x000D                           lt  tbody gt  x000D                           lt tfoot gt  x000D                               lt tr gt  x000D                                   lt th gt  lt div class  aw-50   gt  lt div class  checker  gt  lt span gt  lt input type  checkbox  class  styled  gt  lt  span gt  lt  div gt  lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-200  gt Name lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-50   gt Week lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-100  gt Date lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-100  gt Time lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-200  gt Project lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-400  gt Text lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-200  gt Activity lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-50   gt Hours lt  th gt  x000D                                   lt th gt  lt div class  aw-50   gt Pause lt  div gt  lt  th gt  x000D                                   lt th gt  lt div class  aw-100  gt Status lt  div gt  lt  th gt  x000D                               lt  tr gt  x000D                           lt  tfoot gt  x000D                       lt  table gt  x000D                   lt  div gt  x000D               lt  div gt

User · Answer

Change your second table code like below    lt table style  border  1px solid red width 300px display block   gt   lt thead gt       lt tr gt           lt td width 150 gt Name lt  td gt           lt td width 150 gt phone lt  td gt       lt  tr gt   lt  thead gt   lt tbody style  height 50px overflow auto display block width 317px   gt       lt tr gt           lt td width 150 gt AAAA lt  td gt           lt td width 150 gt 323232 lt  td gt       lt  tr gt       lt tr gt           lt td gt BBBBB lt  td gt           lt td gt 323232 lt  td gt       lt  tr gt       lt tr gt           lt td gt CCCCC lt  td gt           lt td gt 3435656 lt  td gt       lt  tr gt   lt  tbody gt   lt  table gt    JSFIDDLE DEMO

User · Answer

HTML    lt table id  uniquetable  gt       lt thead gt         lt tr gt           lt th gt     field 0  key     lt  th gt           lt th gt     field 1  key     lt  th gt           lt th gt     field 2  key     lt  th gt           lt th gt     field 3  key     lt  th gt         lt  tr gt       lt  thead gt       lt tbody gt         lt tr v-for  obj in objects  v-bind key  obj id  gt           lt td gt     obj id     lt  td gt           lt td gt     obj name     lt  td gt           lt td gt     obj age     lt  td gt           lt td gt     obj gender     lt  td gt         lt  tr gt       lt  tbody gt   lt  table gt    CSS    uniquetable thead      display block      width  100      uniquetable tbody      display block      width  100       height  100px      overflow-y overlay      overflow-x hidden     uniquetable tbody tr  uniquetable thead tr      width  100       display table     uniquetable tbody tr td   uniquetable thead tr th     display table-cell     width 20   important     overflow hidden      this will work as well    uniquetable tbody       width inherit  important      display block      max-height  400px      overflow-y overlay         uniquetable thead       width inherit  important      display block         uniquetable tbody tr   uniquetable thead tr       display inline-flex      width 100          uniquetable tbody tr td    uniquetable thead tr th       display block      width 20       border-top none      text-overflow  ellipsis      overflow  hidden      max-height 400px

User · Answer

Another approach is to wrap your table in a scrollable element and set the header cells to stick to the top   The advantage of this approach is that you don t have to change the display on tbody and you can leave it to the browser to calculate column width while keeping the header cell widths in line with the data cell column widths    x000D   x000D     Set a fixed scrollable wrapper    x000D   tableWrap   x000D    height  200px  x000D    border  2px solid black  x000D    overflow  auto  x000D    x000D     Set header to stick to the top of the container     x000D  thead tr th   x000D    position  sticky  x000D    top  0  x000D    x000D   x000D     If we use border  x000D  we must use table-collapse to avoid x000D  a slight movement of the header row    x000D  table   x000D   border-collapse  collapse  x000D    x000D   x000D     Because we must set sticky on th  x000D   we have to apply background styles here x000D   rather than on thead    x000D  th   x000D    padding  16px  x000D    padding-left  15px  x000D    border-left  1px dotted rgba 200  209  224  0 6   x000D    border-bottom  1px solid  e8e8e8  x000D    background   ffc491  x000D    text-align  left  x000D       With border-collapse  we must use box-shadow or psuedo elements x000D    for the header borders    x000D    box-shadow  0px 0px 0 2px  e8e8e8  x000D    x000D   x000D     Basic Demo styling    x000D  table   x000D    width  100   x000D    font-family  sans-serif  x000D    x000D  table td   x000D    padding  16px  x000D    x000D  tbody tr   x000D    border-bottom  2px solid  e8e8e8  x000D    x000D  thead   x000D    font-weight  500  x000D    color  rgba 0  0  0  0 85   x000D    x000D  tbody tr hover   x000D    background   e6f7ff  x000D    x000D   lt div class  tableWrap  gt  x000D     lt table gt  x000D       lt thead gt  x000D         lt tr gt  x000D           lt th gt  lt span gt Month lt  span gt  lt  th gt  x000D           lt th gt  x000D             lt span gt Event lt  span gt  x000D           lt  th gt  x000D           lt th gt  lt span gt Action lt  span gt  lt  th gt  x000D         lt  tr gt  x000D       lt  thead gt  x000D       lt tbody gt  x000D         lt tr gt  x000D           lt td gt January lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt February  An extra long string  lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt March lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt April lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt May lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt June lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt July lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt August lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt September lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt October lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt November lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D         lt tr gt  x000D           lt td gt December lt  td gt  x000D           lt td gt AAA lt  td gt  x000D           lt td gt  lt span gt Invite   Delete lt  span gt  lt  td gt  x000D         lt  tr gt  x000D       lt  tbody gt  x000D     lt  table gt  x000D   lt  div gt  x000D   x000D   x000D

[html] How to set tbody height with overflow scroll

Examples related to html

Examples related to css