Why navigation bar have different sizes ? - Sencha Touch

Question

I have 3 view are "Home,Category,Info".

This Home panel :

This Category panel :

And This List panel :

In list panel.The navigation bar has different sizes of Home panel and Category panel.

How do I fix ?

Thank you.

----Update----

Code Home view:

Ext.define('Catalog.view.Home', {
    extend: 'Ext.navigation.View',
    xtype: 'homepanel',
    config: {
        // activeItem: 1,
        id: 'mynavigationview',
        navigationBar: {
            items: [
                {
                    xtype: 'button',
                    text: 'Categories',
                    id: 'category',
                    translate: true,
                    translationKey: 'navigationbar.category',
                    align: 'left',
                    action : 'Categories',
     //                handler: function(me) {
                    //  var bar = me.up('navigationview').getNavigationBar();
                    //  // bar[bar._hidden ? 'show' : 'hide']();
                    // }
                }
            ]
        },
        title: 'All',
        iconCls: 'list',
        cls: 'home',
        styleHtmlContent: true,
        tabBarPosition: 'bottom',
        items:[
            {
                title: "All Apps",
                xtype: 'list',
                id:'Applist',
                itemTpl: new Ext.XTemplate(
                    '<img src="http://61.47.41.108:9999/system/appinfos/appicons/000/000/{id}/original/{appicon_file_name}" width="50" heigh="50" style="float:left;clear:both;"></img>',
                    '<div style="margin-left: 60px;word-wrap: break-word;width:80%;">',
                    '<span style="font-size:16px;">{name}</span><br>',
                    '<span style="font-size:13px;color:#7C7C7C;" id="catname">{categoryname}</span>',
                    '</div>'

                ),
                store: {
                    autoLoad: true,
                    fields: ['id','name','created_at','appicon_file_name','categoryid','categoryname','url_ios','url_android','gallery','description'],
                    sorters: [{
                        property:'created_at',
                        direction:'DESC'
                    }],
                    proxy: {
                        type: 'jsonp',
                        url: 'http://61.47.41.108:9999/appinfos.json',
                        reader:{
                            type: 'json',
                            rootProperty:'appinfos'
                        }   
                    }
                }
            }
        ]
    }
});

Code List view:

Ext.define('Catalog.view.Navigation', {
    extend: 'Ext.navigation.View',
    xtype: 'navigation',
    requires: ['Ext.data.Store'],
    config: {
        // navigationBar: false,
        title: 'Categories',
        items: [
            {

                xtype: 'list',
                id: 'Catlist',
                itemTpl: '<span style="font-size:16px;" id="cattname">{name}</span>',

                store: {
                    storeId: 'myStore',
                    autoLoad: true,
                    fields: ['id','name'],
                    sorters: [{
                        property:'name',
                    }],
                    proxy: {
                        type: 'jsonp',
                        url: 'http://61.47.41.108:9999/categories.json',
                        reader:{
                            type: 'json',
                            rootProperty:'Catalog'
                        }   
                    }
                }
            }
        ]   
    }
});

Answer 1

It is due to the styles added by styleHtmlContent: true. Try setting it on both the views, or remove it from both.