Ext 6.2.1 Height of tabpanel is 0!

[staycool11]

Hey!
i use the default Application that is build from cmd and i replaced a tabpanel with a leafletmap as following:

Ext.define('myapp.view.main.Main', {    extend: 'Ext.tab.Panel',
xtype: 'app-main',

requires: [
        'Ext.MessageBox',
'Ext.layout.Fit',
'myapp.view.main.MainController',
'myapp.view.main.MainModel',
'myapp.view.main.List',
'Ext.ux.LeafletMap',
'myapp.view.main.LeafletMapController',
],

controller: [
        'main',
'leafletmap'
],
viewModel: 'main',

defaults: {
        tab: {
            iconAlign: 'top'
},
styleHtmlContent: true
},

tabBarPosition: 'bottom',


items: [{
        title: 'locations',
iconCls: 'x-fa fa-home',
layout: 'fit',
items: [{
            xtype: 'mainlist'
}]
    }, {
        title: 'Users',
iconCls: 'x-fa fa-user',
layout: 'fit',
bind: {
            html: '{loremIpsum}'
}
    }, {
        title: 'Map',
iconCls: 'x-fa fa-map-o',
layout: 'fit',
items: [{
            xtype: 'leafletmap',
id: 'map1',
autoMapCenter: false,
useCurrentLocation: false,
mapOptions: {
                zoom: 14
}
        }]
    }, {
        title: 'Settings',
iconCls: 'x-fa fa-cog',
layout: 'fit',
bind: {
            html: '{loremIpsum}'
}
    }
    ]
});

The positive thing is that the map is working. negative that the height is 0!! so you cant see it..
I cant fix the height to a value cause it should be responisve..
Does anyone have a solution

[Gary Schlosberg]

Panels get their height from the content when it is not set explicitly. Is the html perhaps not populated at render time?

[staycool11]

I got the Problem. For some reason the div class .x-map-container height is 0 and i changed it in my CSS file to 100% which works out.

I accidentallyhave this thread two times cause of problems with editing first. You can delete one:
https://www.sencha.com/forum/showthr...ailable-height

[Gary Schlosberg]

Thanks for the update. If you don't mind, I'd prefer to leave both threads active for future users, as the wordings are different.