I'm having an issue with grids when I re-size the columns. If my grids have 4 or fewer columns they jump to a much larger size when you try to re-size them. This also causes the grid before them to shrink. I'm wondering if this is a column width issue or something I might be missing.
@(Html.Kendo().Grid<DST.DTOs.CoreDTO.ClassificationTypeViewModel>()
.Name("ClassificationTypeGrid")
.ToolBar(toolBar => toolBar.Template("<a class='btn btn-primary' title='Create New' onclick='classCreateItem()' href='#'>Create Classification Type</a>"))
.HtmlAttributes(new { style = "height:90%" })
.Columns(columns =>
{
columns.Bound(p => p.Id)
.Width(20)
.Filterable(false)
.Sortable(false)
.Title("Actions")
.IncludeInMenu(false)
.ClientTemplate("<a href=\"javascript: void(0);\" onclick=\"classEditItem('#: Id #');\" title=\"Edit\"><i class=\"fa fa-pencil-square-o fa-lg\"></i> <span class=\"sr-only\"></span></a>" +
" " +
"# if (timesUsed == 0) { #" +
"<a href=\"javascript: void(0);\" onclick=\"confirmDeleteType('#: Id #'" + "," + "'#: Title #');\" title=\"Delete\"><i class=\"fa fa-trash-o fa-lg\"></i><span class=\"sr-only\"></span></a>" +
"# } else if (timesUsed > 0) { #" +
"<i class=\"fa fa-trash-o fa-lg\" title=\"Classification Type is assigned to a group\"></i>" +
"# } #");
columns.Bound(p => p.Title)
.Width(100)
.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
columns.Bound(p => p.ProtectionLevel)
.Width(100)
.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
})
.Pageable(page => page
.Refresh(true)
.PageSizes(true))
.Sortable(sort => sort
.SortMode(GridSortMode.MultipleColumn))
.Scrollable(o => o.Height("100%"))
.Filterable(filter => filter.Mode(GridFilterMode.Row))
.ColumnMenu()
.Resizable(resizable => resizable.Columns(true))
.DataSource(data => data
.Ajax()
.Read("GetClassifications", "Classifications")
)
)