title: How can I increase the spacing between items in a VBOX using ExtJS 4.1?
body: <p>So I'm using ExtJS 4.1.  I have a viewport that contains two items.  They are stacked correctly but I want to put some space between them.  Margins don't seem to work.</p>
  
  <pre class="lang-js prettyprint-override"><code>var required = '&lt;span style="color:red;font-weight:bold" data-qtip="Required"&gt;*&lt;/span&gt;';
  
  Ext.onReady(function() {
      Ext.QuickTips.init();
  
      window.formPanel = Ext.widget({
          bodyPadding: '5 5 0',
          collapsible: false,
          defaultType: 'textfield',
          frame: true,
          id: 'formPanel',
          layout: 'form',
          renderTo: '',
          title: 'Spring Demo 3 (Lookup Transfer Request)',
          url: contextPath + '/users/ajax',
          width: 450,
          xtype: 'form',
  
          buttons: [{
              text: 'Check Status',
              scope: this,
              handler: function() {
                  formPanel.getForm().submit({
                      success: function(res, req) {
  
                      }
                  });
              }
          }],
  
          fieldDefaults: {
              msgTarget: 'side',
              labelWidth: 105
          },
  
          items: [{
              afterLabelTextTpl: required,
              allowBlank: false,
              fieldLabel: 'Username',
              name: 'username',
              value: ''
          }, {
              afterLabelTextTpl: required,
              allowBlank: false,
              fieldLabel: 'TXID',
              name: 'txid',
              value: ''
          }]
      });
  
      window.resultsPanel = Ext.widget({
          items: [{
              id: 'labMessage',
              margin: '0 0 0 10',
              text: 'Waiting....',
              xtype: 'label'
          }],
          title: 'Results',
          xtype: 'panel'
      });
  
      window.viewPort = Ext.widget({
          items: [formPanel, resultsPanel],
          layout: {
              align: 'center',
              pack: 'center',
              type: 'vbox'
          },
          margins: '10 10 10 10',
          padding: '10 10 10 10',
          renderTo: 'container',
          xtype: 'viewport'
      });
  });
  </code></pre>