Start Building Professional
Web Apps Today

misaligned grid header and column data


I have a problem wherein the grid columns are not lining up with the headers unless I manually resize the header width by clicking and dragging. It seems to depend on the with of the column data. How can I make the columns and header align on the left side even when the init width is narrower than the column and header data?

thank!,
Jeremy

If you not changed default css styles - the height of header and data column must be the same in all situations. ( the only possible case when problem may occur - you not specified column widths at all, or provided not numeric value as column width )

You can try to add next command after data loading ( but it must work without it as well )
    grid.loadXML("some.url",function(){
       mygrid.setSizes();
    });

If problem still occurs for you - please send any kind of sample where it can be reconstructed ( you can send it directly to support@dhtmlx.com )

Hi, I have the same problem discussed by Jeremy above.  I tried your recommendation to add setSizes() that has no effect.  The column header remains larger and wider than the column elements themselves.  Oddly enough, by turning off the browser default styles I can get it to work beautifully.  In Firefox I can turn them off using "Web developer" plug-in for Firefox.  I've tried for days to figure out what in the CSS is causing the

THe problem with my app was global css style classes.  One such style, in my case, was .td that was applying to every td in the app even those in the selector...  I commented the problem styles out and alignment was perfect.