title: Angular ui-grid header chopped
body: <p>This is what I got:
  <a href="https://i.stack.imgur.com/cHgNv.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cHgNv.jpg" alt="enter image description here"></a></p>
  
  <p>While menu button is a bit taller than normal, header is chopped into half.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;style type="text/css"&gt;
          .TreeCCS {width: 900px; height: 250px;}
      &lt;/style&gt;
  &lt;div ng-controller="ctrlMyTree"&gt;
              &lt;br /&gt;ANGULAR
              &lt;div id="afad" ui-grid="grdMyTree" ui-grid-tree-view class="TreeCCS"&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>.js:</p>
  
  <pre><code>var aIS = angular.module("app", ["ui.grid", "ui.grid.treeView"]);
  aIS.controller("ctrlMyTree", function ($scope, $http)
  {
      $scope.grdMyTree= { enableGridMenu: true, showTreeExpandNoChildren: true, enableTreeView: true, };
  </code></pre>
  
  <p>Node and leaf levels are not defined yet, following <a href="http://ui-grid.info/docs/#/tutorial/215_treeView" rel="nofollow noreferrer">this official tutorial</a> but using dynamic json to load data. Works if Take out all tree-related.</p>
  
  <p>ui.grid.js = 3.2.9. What am I missing here?</p>