I am having an issue with the WebDataGrid not displaying columns correctly in Chrome. After some research it looks as though Chrome is ignoring width settings on tables unless you set "display:block;" in the style. I was able to manually set "display:block;" using Chromes in browser html editor and the table showed up properly. What would be the best way to set "display:block;" on the WebDataGrid control?
CSS3 has a potential solution, though I haven't tested it: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp
Did you happen to find a solution? All column widths gets reset after applyClientBinding(). Stuck with this silly bug
Hi haloparc,
Thank you for your update regarding this scenario.
While adjusting the padding for WebKit browsers may not be available out-of-the-box, the changes could be done by detecting the browser on the client and doing the necessary changes in the Initialize event handler.
Please feel free to contact me if you have any questions.
Best Regards,
Petar IvanovDeveloper Support EngineerInfragistics, Inc.http://www.infragistics.com/support
I asked some time ago:"I've discovered that if you set a fixed pixel-width on WDG columns, the width does not match up from FF/IE to Webkit (differs by ~20px)-looks to be something to do with the way the padding is handled or somesuch-such that if you fix the width for one, it breaks it for the other. Wasn't able to find anyone else talking specifically about this problem online."
IG Response, after some testing:"I have heard back from development regarding this issue. Based on the update from development, I understand this behavior is browser specific. Chrome browser fails to process padding-left/right in order to adjust overall size of its TDs. Application uses "Default" style and it has classes with "padding:5px 8px 5px 8px;".
In theory overall width of TD should be equal to width+paddingLeft/Right+borderWidthLeft/Top=20+8+8=32px, but Chrome uses only width and keeps 20px. Since this is browser specific behavior the work around is to remove "padding:5px 8px 5px 8px;" from all classes in ig_dataGrid.css file"
I don't know if it's possible, but it might be nice to detect a webkit browser and adjust the styling a bit (different CssClass, maybe?)
Hi rzwirtz,
Thank you for posting in the community.
A detailed guide for styling the WebDataGrid can be found at:
http://blogs.infragistics.com/blogs/engineering/archive/2010/08/25/webdatagrid-css-styling-guide.aspx
As I am unsure of the specifics of the issue you are experiencing in Chrome, I would suggest that you explore the igg_Control, .igg_Header and tbody.igg_Item>tr>td CSS class located in /ig_res/Default/dataGrid.css.
Please let me know if this helps.