JqGrid column does not match column headers

Question

I am using jqGrid 3.6.5 and IE8

When setting up shrinkToFit: false columns are clearly not aligned with the column headers.
If I turn on shrinkToFit: true , the problem will disappear, but I will lose the absolute size of the columns.
Resizing columns (in code or dynamically by the user) does not affect this problem.

See image for illustration.

alt text http://www.freeimagehosting.net/uploads/274ab94e4d.png

Answer 1

As you can see from my original image (in the question), I have no borders between the cell columns. I used border-right-color: none
This seems to be the reason. Instead, I changed it to border-right-color: White (to match the border with the background color), and the columns are now fully aligned with the column headers.

Perhaps this was a problem with IE, as it worked correctly in Chrome even before the change.

Answer 2

The alignment of column headers by default is always "center" and regardless of the "align" option from ColModel (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:colmodel_options ).

You can change the alignment of column headings using the method that I describe in jQuery JQGrid. How to set grid header cell alignment? .

I can not reproduce the problem with shrinkToFit: false , which you described in your question. What version of jqGrid are you using? If you post sample code that reproduces the problem, I can try to help you.

PS Probably the CSS that you use in your example can also be important. If you change the fields of the table, you must also change the cellLayout jqGrid parameter.