Miss-aligned headers after creating table

Miss-aligned headers after creating table

kim.kajus.andersen@groupm.comkim.kajus.andersen@groupm.com Posts: 2Questions: 1Answers: 0

The table headers are not aligned with the body columns after creating the table.

Triggering page resize fixes the problem but it is not very clean $(window).trigger('resize');

Calling 'table.columns.adjust().draw();' fixes it too but only partially. In this case the headers are re-positioned but not perfectly aligned.

Nevertheless I would expect the headers to be in the right place out of the box.

Anybody has experienced the same problem? Any better solution?
Is this a known bug with datatables?

For screenshots check this link: http://stackoverflow.com/questions/37549242/datatables-net-miss-aligned-headers-after-creating-table

Thanks

Answers

  • jr42.gordonjr42.gordon Posts: 305Questions: 2Answers: 49

    Make sure you don't have any styling overriding DataTables. It looks like you might have margin or padding -right on your header.

  • kim.kajus.andersen@groupm.comkim.kajus.andersen@groupm.com Posts: 2Questions: 1Answers: 0

    Thanks but it's not that

  • jr42.gordonjr42.gordon Posts: 305Questions: 2Answers: 49

    Then we would need a link to an example with your bug. "table.columns.adjust()" works most of the time, but if you are hiding/showing your table via tabs or anything else, you need to make sure all transition animations have completed before calling "table.columns.adjust()".

This discussion has been closed.