PDA

View Full Version : Border layout in Tab



ljparra
24 Oct 2010, 11:23 PM
I'm wondering how to make this layout work properly, render ok in IE(8) and Opera(10.53), but not in FF(3.6.11) neither Safari(4.05), east region render outside.


Ext.onReady(function(){

new Ext.Viewport({
layout: 'vbox',
items: [{
xtype: 'container',
height: 30,
html: 'Username - Logout'
},
{
xtype: 'tabpanel',
flex: 1,
activeTab: 0,
items: [{
xtype: 'container',
title: 'Tab 1',
layout: 'border',
items: [{
region: 'west',
title: 'West',
width: 150
},
{
region: 'center',
title: 'Center'
},
{
region: 'east',
title: 'East',
width: 150
}]
},
{
xtype: 'container',
title: 'Tab 2'
},
{
xtype: 'container',
title: 'Tab 3'
}]
}]
});

});

Animal
24 Oct 2010, 11:40 PM
vbox will not width the child items unless you configure it with align

ljparra
25 Oct 2010, 5:00 AM
like a charm, many thanks :)