带数据表的复杂标题

Question

我正在使用数据表FixedHeader扩展而不滚动。 复杂标题的列（带有rowspan和colspan的标题）未正确对齐。 查看图片和codepen示例。

Pictures

$(document).ready(function() {
  $('#example').DataTable({
    "paging": false,
    "ordering": false,
    "info": false,
    "searching": false,
     fixedHeader: {
     header: true,
     footer: true
     },
   });
 });

有关如何解决此问题的任何想法？

Codepen example

Answer 1

请为每个cols提供colum width。这将解决问题。

<colgroup>
   <col width="20%" />
   <col width="15%" />
   <col width="15%" />
   <col width="15%" />
   <col width="15%" />
   <col width="15%" />
</colgroup>