페이지 레이아웃

item의 region이 관건이었음
...흠 그것도 모르고 region을 임의로 지정해서 사용했더니 완전 걸래 됐었음

north
west  center east
south

를 사용해야 함...

// begin of onReady
Ext.onReady(function(){
    new Ext.Viewport({
        layout: 'border',
        defaults: {
            activeItem: 0
        },
        items: [{
            region: 'north',
            title: 'search',
            //html: '<h1 class="x-panel-header">Page Title</h1>',
            contentEl: 'div_header',
            split: true,
            autoHeight: true,
            border: false,
            margins: '0 0 0 0',
            height: 100,
            minHeight: 100
        },  {
            region: 'west',
            collapsible: true,
            title: 'Navigation',
            xtype: 'treepanel',
                width: 200,
            autoScroll: true,
            split: true,
            loader: new Ext.tree.TreeLoader(),
            root: new Ext.tree.AsyncTreeNode({
                expanded: true,
                children: [{
                    text: 'Menu Option 1',
                    leaf: true
                }, {
                    text: 'Menu Option 2',
                    leaf: true
                }, {
                    text: 'Menu Option 3',
                    leaf: true
                }]
            }),
            rootVisible: false,
            listeners: {
                click: function(n) {
                    Ext.Msg.alert('Navigation Tree Click', 'You clicked: "' +  attributes.text + '"');
                }
            }
        },        
        {
            region: 'center',
            xtype: 'tabpanel',
            items: {
                title: 'Default Tab',
                html: 'The first tab\'s content. Others may be added dynamically'
            }
        }, {
            region: 'south',
            title: 'Information',
            collapsible: false,
            html: 'Information goes here',
            split: true,
            height: 300,
            minHeight: 300
        }]
    });
})