How to let two element occupy 30% and 70% in extJs

Question

I want to let the two textfield exists in the same line and also it occupy 30% and 70% respectively.

{
columnWidth : 1.0,
items : [ {
anchor: '30%',
fieldLabel : 'A',
xtype : 'textfield',
value : ""
} ]
},
{
columnWidth : 0.9,
items : [ {
fieldLabel : 'B',
xtype : 'textfield',
anchor: '70%',
value : ""
} ]
}

Answer 1

Ext.require('*');

Ext.onReady(function(){

    new Ext.panel.Panel({
        renderTo: document.body,
        width: 500,
        height: 200,
        layout: 'hbox',
        defaultType: 'textfield',
        items: [{
            flex: 3
        }, {
            flex: 7    
        }]
    });

});