Issue with vbox panel and hbox panel into tabPanel

[sanova]

Another issue with layout:

I have 3 grids into a primary tabPanel. These grids are located in this way into tabPanel:

grid1: on the left
grid2 and grid3 on the right.

i wrote this code with two panel into tabPanel:

// Container of grid2 and grid3 with vbox layout
container1 = new Ext.Panel ({        title:        'container1',
        cls:        'x-btn-text-icon x-form-toolbar-standardButton',
        iconCls:    'cont1',
        layout: {
            type:    'vbox',
            align:    'stretch'
        },
        items:     [
            grid2,
            grid3
        ]
    });

// Container of grid1 (on the left) and container1 (on the right) with hbox layout
container2 = new Ext.Panel ({
        title:        'container2',
        cls:        'x-btn-text-icon x-form-toolbar-standardButton',
        iconCls:    'cont2',
        layout: {
            type:     'hbox',
            align:    'stretch'
        },
        items:     [
            grid1,
            container1,
        ]
    });

// Primary tabPanel with container 2 (that contains all other objects)
tabPanel1 = new Ext.TabPanel({
        activeTab:        0,
        flex:            1,
        autoScroll:     true,
        bodyStyle: 'background:#efefff',
        items:[
            container2           
        ]
    });


If i put grid2 and grid3 into container2 (hbox layout) it works fine.
But in that way i can not see grid2 and grids3 into container1. I can see only grid1 into
container2 and in tabPanel1.

What's wrong?

Thanks in advance

[sanova]

I solved. I set layout: 'border' and flex:1 to container 1 and it works fine.