Simple tab panel loads in Firefox fine, not in IE7
I've got a very simple viewport that I created to use in a shared development environment where we're ramping up on extjs... For the moment it's just a toolbar and a tab panel. Using extjs 4.0.7 this renders as expected (3 tabs, with the inlined html), works fine in both IE7 and Firefox. When I updated to the 4.1.0-beta2 it stopped working in IE7, now I only get the toolbar and nothing of the tab panel. Firefox still renders it just fine. My app.js is basically empty other than the autoCreateViewport:true ...
Code:
Ext.define('lwdiag.view.Viewport', {
extend: 'Ext.container.Viewport',
layout: 'fit',
requires: ['Ext.tab.*'],
initComponent: function() {
this.items = {
dockedItems: [{
dock: 'top',
xtype: 'toolbar',
height: 20,
items: [{
xtype: 'component',
html: 'navigation toolbar'
}]
}
],
layout: {
type: 'border'
},
items: [{
width: 600,
xtype: 'tabpanel',
activeTab: 0,
region: 'center',
items: [{
xtype: 'panel',
title: 'Content Panel 0',
html: '<center>Panel Content</center>'
},
{
xtype: 'panel',
title: 'Content Panel 1',
html: 'For testing purposes replace this entry with "xtype:<yourviewalias>" and remove the html entry'
},
{
xtype: 'panel',
title: 'Content Panel 2',
html: 'For testing purposes replace this entry with "xtype:<yourviewalias>" and remove the html entry'
}]
}]
}
this.callParent();
}
});
Did something change in 4.1 related to default height maybe? There are no errors in firebug or in IE...
Thanks!
