put tabbar at bottom

[vivendi]

I have a panel in which i want to place a tabbar at the bottom. But for some reason it doesn't go down. It stays at the top... Anyone any idea what i'm doing wrong??



var BottomTabs = new Ext.TabPanel({
tabBar: {
dock: 'bottom',
ui: 'light',
layout: {
pack: 'center'
}
},
items: [{
title: 'About',
html: '<p>Docking tabs to the bottom...</p>',
iconCls: 'info',
cls: 'card card1'
}]
})

app.views.intro = Ext.extend(Ext.Panel, {
fullscreen: true,
cls: 'background',
items: [BottomTabs]
});

[vivendi]

Nevermind that, it's working now. I'm not trying to add a tabpanel inside a panel anymore, but i simply changed the panel to a TabPanel.

Right now i'm trying to load a 'list' inside a panel. But that isn't working.
Nothing is shown...

Is it even possible to have a list inside of a tabpanel...??

This is my code:



// Create model and store
app.models.locations = Ext.regModel('app.models.locations', {
fields: ['hostColumn', 'columnText']
});

app.stores.store = new Ext.data.JsonStore({
model : 'app.models.locations'
});

// Add an item to the store
var rank = Ext.ModelMgr.create({
hostColumn: '1',
columnText: 'ghgh'
}, 'app.models.locations');

app.stores.store.add(rank);

app.views.intro = Ext.extend(Ext.TabPanel, {
cls: 'background',
tabBar: {
dock: 'bottom',
//ui: 'light',
cls: 'custom-tabs',
layout: {
pack: 'center'
}
},
items: [{
title: 'test',
items: [{
xtype: 'list',
store: 'app.stores.store',
itemTpl : '{columnText}',
}],
iconCls: 'info',
cls: 'card card1'
}]
});