title: How to fix height of row of kendo grid
body: <p>In my Kendo Grid I have a column which have html values. While displaying it increases the height row of that grid.</p>
  
  <p>How can I ensure data will be displayed in single row whatever the value is.</p>
  
  <p>Click <a href="https://jsfiddle.net/nbkx010c/2/" rel="nofollow noreferrer">here</a> for the fiddle.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$("#grid").kendoGrid({
    columns: [
      { title: "Name", field: "name", encoded: false }
    ],
    dataSource: [ { name: "&lt;br&gt;Jane Doe&lt;/br&gt;&lt;br&gt;Lespie Knope&lt;/br&gt;&lt;br&gt;Ron Swanson&lt;/br&gt;" } ]
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.k-grid tbody tr {
          width: 50px;
      }
  
      .k-grid td {
          white-space: nowrap;
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.common.min.css"&gt;
      &lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.rtl.min.css"&gt;
      &lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.default.min.css"&gt;
      &lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.dataviz.min.css"&gt;
      &lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.dataviz.default.min.css"&gt;
      &lt;link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.mobile.all.min.css"&gt;
  
      &lt;script src="http://code.jquery.com/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
      &lt;script src="http://cdn.kendostatic.com/2015.1.318/js/kendo.all.min.js"&gt;&lt;/script&gt;
      
      &lt;div id="grid"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
   </p>