表与可滚动的正文和colgroup不起作用

Question

我想通过colgroup定义cols的宽度。另外，tbody应该是可滚动的。但是不行。我有没有js的解决方案？

js fiddle

HTML

 <colgroup> 
     <col span="1" style="width: 15%;"> 
     <col span="1" style="width: 40%;"> 
     <col span="1" style="width: 20%;"> 
     <col span="1" style="width: 25%;"> 
    </colgroup> 

Answer 1

添加到您的CSS：

td:nth-child(1), th:nth-child(1) { 
    width: 15%; 
} 
td:nth-child(2), th:nth-child(2) { 
    width: 40%; 
} 
td:nth-child(3), th:nth-child(3) { 
    width: 20%; 
} 
td:nth-child(4), th:nth-child(4) { 
    width: 25%; 
} 

TBODY滚动工作正常铬。我不知道它是如何在其他浏览器

Answer 2

需要设置display:inline-block;到<col>

col{ 
    display: inline-block; 
    height:20px; 
    background: #000; 
} 

See demo here