title: extjs container hbox height 100%
body: <p>I am new in extjs and just stuck on dynamic (percent) height in hbox setting.</p>
  
  <p>here is my extjs code</p>
  
  <pre><code>"xtype": "container",
  "layout": "fit",
  "width": "100%",
  "height": "100%",
  "cls": "dashboard-layout dashboard-layout-1-2",
  "items": [
    {
      "xtype": "dashboardpanelcontainer",
      "height": "45%"
    },
    {
      "xtype": "container",
      "layout": "fit",
      "width": "100%",
      "height": "45%",
      "layout":
        {
          "type": "hbox",
          "align": "stretch"
        },
      "items": [
        {
          "xtype": "dashboardpanelcontainer",
          "flex": 1
        },
        {
          "xtype": "ruban-dashboardpanelcontainer",
          "flex": 1
        }]
    }]
  </code></pre>
  
  <p>this peace of code is working fine and setting height to 45%</p>
  
  <pre><code>"xtype": "dashboardpanelcontainer",
  "height": "45%"
  </code></pre>
  
  <p>second item as a container "xtype": "container" is setting height to 45% too, but the hbox items are not picking this 45%, the height of the hbox items are 0px</p>
  
  <p>I cant use "xtype": "window" or "xtype": "viewport" needs to be inside "xtype": "window"</p>
  
  <p>Any help how to set container hbox item height as percentage in my case 45%.</p>
  
  <p>If i add style in hbox item, its not working too</p>
  
  <pre><code>"xtype": "dashboardpanelcontainer",
  "flex": 1,
  "style":
    {
      "height": "100%"
    }
  </code></pre>
  
  <p>Thanks for the help</p>