title: Extjs : Toolbar inside a panel not resizing on Browser resize
body: <p>I have a toolbar and a grid within a Panel. On resize, the grid looks good. However the toolbar maintains its original dimensions and does not resize causing a few buttons to hide .
  How do I rectify this?</p>
  
  <pre><code>{
                  xtype: 'panel',
                  region: 'center',
                  layout: 'border',
                  tbar:[
                      {
  
                          xtype: 'buttongroup',
                          region: 'center', 
                          items:  getToolBarButtons()      // method to add buttons to toolbar dynamically
                      }
                  ],
                  items: [
                      {
                          xtype: 'tabpanel',
                          activeTab: 0,
                          layout: 'fit',
                          region: 'center',
                          disabled: 'true',
                          items:[
                              {
                                  // grid 1
                                  height : '80%',
                                  width : '100%'
                              },
                              {
                                  // grid 2
                                  height : '80%',
                                  width : '100%'
                              }
                          ]
                      }
                  ]
              }
  </code></pre>
  
  <p><strong>Edit</strong>: </p>
  
  <p>I replaced <code>tbar</code> with <code>dockedItems: [{ xtype:' toolbar' ...}]</code> . The toolbar doesn't get rendered at all</p>