Bootstrap-table: header and column data not aligned properly in chrome and IE10,IE11

[KulanthaivelChinnadurai]

please check the below link for the issue.
http://jsfiddle.net/hf50xg7z/
Please scroll till last column to see alignment issue.
Note: In firefox alignment is working fine.

Request to provide a solution.

[geospatialem]

I am having similar issues in my application as well (in Internet Explorer, Chrome, and Firefox), _see below_:

Overall view:

Close view:

[darzzydarzz]

any updates on ETA for this one?

[LawrieDawson]

Hi
Do we have an update on the call. it is happening in most browsers.

[LawrieDawson]

Managed to fix this for all browsers except IE 9
I put this bit of code into the bootstrap-table.js file at roughly line 1904.
var colWidth = $('#table thead')[0].children[0].children[index].children[1].getBoundingClientRect().width;
and changed line 1905/6 from
that.$header_.find(sprintf('th[data-field="%s"]', visibleFields[index]))
.find('.fht-cell').width($this.innerWidth());

to

that.$header_.find(sprintf('th[data-field="%s"]', visibleFields[index]))
.find('.fht-cell').width(colWidth);

We don't use anything below IE 9 and seems to work in 10 11 and edge.
you may need to clear the browsers cache to see the changes.

Any help with IE 9 would be appreciated.

[djhvscf]

As you can see here this is solved in our latest release http://jsfiddle.net/djhvscf/hf50xg7z/7/