title: ExtJS 4.1 How to change grid panel header height
body: <p>I want to change the Ext.grid.Panel header height.</p>
  
  <p>The height of a grid panel header is forcibly set at 28px.</p>
  
  <ol>
  <li>No sass settings</li>
  <li>Header configuration on the panel did not work for me</li>
  <li>Modifying the grid columns height seems to work when configuring &lt; 28px. 28px seems to be the minimum.</li>
  </ol>
  
  <p>This is what I have so far (and it works), but I don't like the solution.</p>
  
  <pre><code>Ext.define('Ext.grid.Panel', {
      listeners: {
          beforerender: function (cmp, eOpts) {
              cmp.headerCt.setHeight(25);
          }
      }
  });
  </code></pre>
  
  <p>Additionally, column headers seem to be fixed at 28px as well. Setting the height of the header to 25 will not set the column header to 25.  You need to override that as well in the scss / css.  Otherwise your column header menus will display off the 28px height.</p>
  
  <pre><code>.x-column-header
  {
      height: 25px;
  }
  </code></pre>
  
  <p><strong>This solution does not work: If you drag column headers, changing the column's index position, it will break -.-</strong></p>
  
  <p>Recommedations?</p>