title: Kendo Grid resizable is not working in IE
body: <p>I am using Kendo Grid to show the records.Below is my sample Html Page where i want to achieve the result for re-sizable in IE only. I have modified the code for Sample purpose only in Html. Resizable in Chrome is working.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;base href="http://demos.telerik.com/kendo-ui/grid/column-resizing"&gt;
      &lt;title&gt;&lt;/title&gt;
  
      &lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.mobile.all.min.css" /&gt;
      &lt;link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.common-material.min.css" /&gt;
      &lt;link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.material.min.css" /&gt;
      &lt;link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.default.mobile.min.css" /&gt;
  
  
      &lt;script src="//kendo.cdn.telerik.com/2016.2.607/js/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="//kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"&gt;&lt;/script&gt;
  
  
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /&gt;
      &lt;link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet"&gt;
      &lt;script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"&gt;&lt;/script&gt;
  
      &lt;style&gt;
          .wrap {
              width: 95%;
              margin: 0 auto;
          }
  
          .PageContentHeading {
              padding: 3% 0;
          }
  
              .PageContentHeading h3 {
                  margin: 0;
              }
  
          .AddUser {
              margin-left: 10px;
          }
  
              .AddUser a {
                  border-radius: 0;
                  padding: 4px 12px;
              }
  
          .btn-group-sm &gt; .btn, .btn-sm {
              border-radius: 0;
          }
  
          .SupplierCompanyName {
              color: red;
          }
  
          .k-grid td {
              border-left: none;
          }
      &lt;/style&gt;
  
  &lt;/head&gt;
  &lt;body&gt;    
  
      &lt;script type="text/x-kendo-template" id="toolBarTemplate"&gt;
          &lt;div class="toolbar"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-md-4" style="float:right;"&gt;
                      &lt;div class="input-group"&gt;
                          &lt;span class="input-group-addon"&gt;&lt;span class="glyphicon glyphicon-search" aria-hidden="true"&gt;&lt;/span&gt;&lt;/span&gt;
                          &lt;input type="search" class="form-control" id='txtSearchString' placeholder="Search by User Details"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/script&gt;
      &lt;div class="wrap"&gt;
  
          &lt;div class="main"&gt;
  
              &lt;div class="PageContentHeading"&gt;
  
                  &lt;h3 class="pull-left"&gt;
                      Manage Users -
                      &lt;span id="supplierPanel"&gt;
                          &lt;span id="supplerCompany" class="SupplierCompanyName"&gt;
                              ABC Aerospace Inc.
                          &lt;/span&gt; &lt;span class="SupplierCompanyID"&gt;
                              [ ID_0001 ]
                          &lt;/span&gt;
                      &lt;/span&gt;
                  &lt;/h3&gt;
  
                  &lt;div class="pull-right AddUser"&gt;
                      &lt;a href="@Url.Action(" AddUser", "user" )" class="btn btn-success" style="color:#FFF;"&gt;Add User&lt;/a&gt;
                  &lt;/div&gt;
                  &lt;div class="pull-right ShowUsers"&gt;
                      &lt;span class="labelname"&gt;Include Inactive Users:&lt;/span&gt;
                      &lt;input type="checkbox" checked data-toggle="toggle" data-on="True" data-off="False" data-onstyle="success" data-offstyle="danger" data-size="small"&gt;
                  &lt;/div&gt;
                  &lt;div class="clearfix"&gt;&lt;/div&gt;    
              &lt;/div&gt;    
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="grid"&gt;&lt;/div&gt;
      &lt;script&gt;
          var apiUrl = "http://localhost:55020/";
          var dynamicTemplate;
          var col = [];
  
          function switchChange(e) {
              //alert('E');
          }
  
          function GetColumnsDetails() {
  
              var rowsTempldateStyle = "&lt;tr&gt;   &lt;td style='word-wrap: break-word'&gt;  &lt;span class='UserDesignation'&gt; #:FullName  #&lt;/span&gt;&lt;span class='UserName'&gt;#:title #&lt;/span&gt; &lt;/td&gt;  ";
              $.ajax({
                  url: apiUrl + "api/user/GetColumns/1",
                  type: 'GET',
                  async: false,
                  success: function (result) {
                      if (result.length &gt; 0) {
                          for (var i = 0; i &lt; result.length; i++) {
                              col.push({
                                  field: result[i].colnameName,
                                  title: result[i].titleName,
  
                              });
                          }                        
                          col.push({
                              title: "Active",
                              template: "&lt;input type='checkbox' disabled='disabled' /&gt;",
                              width: "70px"
                          })
                          col.push({
                              title: "Action",
                              name: 'edit',                           
                              width: "70px"
                          });
                      }
                  }
              });
          } 
          $(document).ready(function () {
  
              //
              GetColumnsDetails();
              $("#grid").kendoGrid({
                  dataSource: {
                      pageSize: 5,
                      batch: false, // enable batch editing - changes will be saved when the user clicks the "Save changes" button
                      transport: {
                          read: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
                      },
                      pageSize: 20
                  },
  
                  height: 550,
                  sortable: true,
                  resizable: true,
                  filterable: true,
  
                  pageable: {
                      refresh: true,
                      pageSizes: true,
                      buttonCount: 2
                  },
                  //resizable: true,
                  columns: [{
                      template: "&lt;div class='customer-photo'" +
                                      "style='background-image: url(../content/web/Customers/#:data.CustomerID#.jpg);'&gt;&lt;/div&gt;" +
                                  "&lt;div class='customer-name'&gt;#: ContactName #&lt;/div&gt;",
                      field: "ContactName",
                      title: "Contact Name",
                      width: 240
                  }, {
                      field: "ContactTitle",
                      title: "Contact Title"
                  }, {
                      field: "CompanyName",
                      title: "Company Name"
                  }, {
                      field: "Country",
                      width: 150
                  }]
  
              });
          });
  
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I am using Latest version of Kendo but still it is not giving me the expected result. I have tried also to give the Width of each column but the same problem in IE. Can someone help me with this.</p>