How to Increase Column Space in EXtJS Column Layout - extjs4

Question

i have designed an entry form as shown,
i need to have same space between test box and Middle name label.
My code is as follows,
var patientForm = new Ext.FormPanel({
layout: 'column',
columnWidth:1.5,
renderTo: "patientCreation",
frame: true,
autoScroll:true,
title: 'Create Patient',
bodyStyle: 'padding:9px',
width: 900,
items: [
{ xtype: 'textfield',
fieldLabel: 'FirstName',
name: 'firstName',
vtype : 'alpha',
allowBlank:false
},{
xtype: 'textfield',
fieldLabel: 'MiddleName',
name: 'middleName',
vtype : 'alpha'
},{
xtype: 'textfield',
fieldLabel: 'LastName',
name: 'lastName',
vtype : 'alpha',
allowBlank:false
},{
xtype: 'textfield',
fieldLabel: 'Email',
name: 'email',
vtype: 'email',
allowBlank:false
},
....
....
]
How to leave/increase space between text box and Middle name column?

Answer 1

If you know your number of columns, use column layout. Otherwise do this:
defaults: {
labelStyle: 'padding-left:10px;'
},
items: [...]

Answer 2

Add a defaults config to the container of the columns. All it's children will have the settings you define in defaults (docs). In this example there's just the margin setting (docs) in defaults that will be applied to each item/column.
Ext.create('Ext.panel.Panel', {
title: 'Column Layout - with default margins',
width: 350,
height: 250,
layout:'column',
defaults: {
margin: '0 15 0 0' //top right bottom left (clockwise) margins of each item/column
},
items: [{
title: 'Column 1',
columnWidth: 0.25
},{
title: 'Column 2',
columnWidth: 0.55
},{
title: 'Column 3',
columnWidth: 0.20
}],
renderTo: Ext.getBody()
});
The accepted solution works only with fields as columns. My solution works with any type of column.
PS: the column layout documentation is here.