css styling for grid columns; max-width for grid columns

[Larry]

For the Grid, is there a way to style width in css instead of with the component's "width" property in html or js?

Also, I couldn't see a solution for using css max-width to specify column widths which is what I most want to do. Is there a way to do that for Kendo grid as I can for regular html tables?  The goal is to make a column take up no more room than it needs (for its widest value or its header, whichever is greater), and no more than the prescribed maximum regardless.  Without max-width, it's hard to style tables well in my applications.

Thanks,

Larry

[Dimo]

Hi Larry,

Defining Grid column widths or other per-column styles via external CSS is officially not supported. It is theoretically possible, but a little cumbersome.

$(document).ready(function() {
    var grid = $("#grid").kendoGrid({  /*...*/  }).data("kendoGrid");

    var headerCols = grid.thead.parent().find("col");
    headerCols.eq(0).addClass("myCol0");
    headerCols.eq(1).addClass("myCol1");

    var bodyCols = grid.tbody.parent().find("col");
    bodyCols.eq(0).addClass("myCol0");
    bodyCols.eq(1).addClass("myCol1");

});

.myCol0
{
    width: 100px;
}
.myCol1
{
    width: 200px;
}

Min/max dimension styles are ignored by table elements. Generally, you have two options - use an automatic table layout or fixed table layout. More information is available at:

http://docs.kendoui.com/getting-started/web/grid/walkthrough#column-widths
Regards,
Dimo
Telerik