The centered columns in the first row of data in my WebDataGrid shifts to left. This is very noticeable, and presents an unprofessional appearance.
Has anybody else encountered this? What is the fix?
Hello FireStorm12,
Can you tell me what version and build of our controls do you use and what is the browser that you use for testing?
Also do you center the text in the columns or the columns itself and where does the shift occur – in the column text or in the columns themselves?
I am waiting for your response.
WebDataGrid - Infragistics4.Web.v11.1, Version=11.1.20111.1006
I am centering the data via CssClass. How do you center the column itself with WebDataGrid?
The shift occurs within the cell. It is slightlly off-center.
Did you use selectors when applying the styles?
Please refer to the following guide that shows how the grid can be styled with CSS - http://community.infragistics.com/blogs/engineering/archive/2010/08/25/webdatagrid-css-styling-guide.aspx
There is an example of centered text in the column showed. Follow it and let me know what the results are in your application.
Here is the style definition:
tbody
> tr > td.gridCenter { text-align: center; FONT-SIZE: 9pt; FONT-FAMILY: Tahoma; background-image: none; border: solid 1px Gray; border-top-style: none; border-right-style: none; height: 24px; }
I have mitigated the problem by setting the first centered column width using percentage rather than pixels.
Did the solution that you found solve this behavior?
If you need further assistance with this question feel free to contact me again.
The solution is acceptable, but not idea. Apparently WebDataGrid can have problems when you set some columns to fixed size, while setting other columns to a percentage.
Hopefully, Infragistics can fix this for future use.
Inform me if you need more information.
It depends on how you set the container size also. If you set fixed container and then set the first column to “100px” and second and third to “30%” and “60%” for example the grid columns will be aligned properly.
It depends on how you actually format the grid and by CSS files used too. The gird can be fully customized with CSS classes, but if dome of these classes override the default grid style classes, appearance can be unpredictable.
Best way to tweak the grid in this situation is to use Developer Tools (F12) in your browser in order to see exactly which styles are applied to the grid and which are rejected.
Let me know if you need further information about this question.